Make chunking toggleable

[tbillington]

Is this a bug report?

Yes

Steps to Reproduce

react-scripts at 2.0.0-next.66cc7a90. No dynamic imports in code.

Build output had no chunks:

File sizes after gzip:

  107.09 KB (+1.2 KB)  build/static/js/main.cd7fd363.js
  305 B (+126 B)       build/static/css/main.a308f785.css

Change react-scripts to 2.0.0-next.3e165448.

Run Yarn, build app.

File sizes after gzip:

  99.7 KB               build/static/js/vendors.7dcb2806.chunk.js
  2.94 KB (-104.15 KB)  build/static/js/main.b3946f9a.chunk.js
  617 B                 build/static/js/runtime~main.41117e05.js
  252 B (-53 B)         build/static/css/main.fd7b7d90.chunk.css

Expected Behavior

Same output structure.

Actual Behavior

Different output structure.

The change identified in the react scripts 2.0 github issue didn't mention any changes to the default build process so I'm under the assumption that this build output is a bug.

[bugzpodder]

I do believe we split vendor and main bundles by default in the current webpack 4 config:
https://github.com/facebook/create-react-app/blob/next/packages/react-scripts/config/webpack.config.prod.js#L159

[tbillington]

@bugzpodder Is this going to be configurable? Looks hardcoded at the moment.

Single JS & CSS file installs have been invaluable for my use case.

[bugzpodder]

@tbillington currently this is not configurable. Can you elaborate on why having an extra js file would be cause an headache?

[tbillington]

Sure. I work on lots of projects that involve the JS I write (wrapped in CRA) being embedded within existing plain server rendered sites managed by third parties. With the current react-scripts 1 behaviour this is super easy, I can just build the files and hand them over to the site owner without needing to know where they'll be hosted (setting package.json homepage field). The only 2 file output is also super handy, there's much less to worry about. With GZIP the sizes aren't an issue, but having handfuls of files with a required name is annoying.

In short:

• Only 2 file handover (JS & CSS, or just JS if using CSS in JS !) of built assets to third party is a win 👍
• Not caring about hosting/url location including filename, customers often want to rename the files

Can expand on this if you want but that's the gist.

[Timer]

Can you tell me if the proposal in #4633 (comment) would satisfy your use case?

[tbillington]

@Timer That seems reasonable, though I'm certainly no expert on dynamic imports 😅