Created by: neeharv
HACK ALERT. This is an extremely WIP hacky way to do split builds into ES6 and ES5 builds, as described in https://github.com/facebookincubator/create-react-app/issues/3125. I am simply putting this up to spark discussion on the right way to do this.
This works by -
- Turning
webpack.prod.jsinto a factory function that takes intargetand returns different configs with varying targets - We suffix the
modulebuild assets with.es6.js(this can be moved to config easily) - For the
ES6build, we don't include polyfills - We get 2 asset-manifests this way, and hence 2 different service workers that load the relevant built code
- Switch over to
"uglifyjs-webpack-plugin": "^1.0.0-beta.2"so we can minify theES6code - It currently only spits out the
ES6build only in this PR, because the HtmlWebpackPlugin looks at webpack's stats file to generate the variables for the template. I have a local version of HtmlWebpackPlugin that reads the assets of both builds and makes them available for the template, but that is beyond the scope of this and an extremely bad way of doing things
An alternate to this would be to somehow get webpack to accept two different loader configurations for two different entry points, in the same build. AFAIK, this is what @geelen was trying and webpack today doesn't support this. Hence the above approach of running two parallel builds and then using a custom templating job to add the asset names of the ES5 and the ES6 code to the output html.