Skip to content
GitLab
Projects Groups Snippets
  • /
  • Help
    • Help
    • Support
    • Community forum
    • Submit feedback
    • Contribute to GitLab
  • Sign in / Register
  • C create-react-app
  • Project information
    • Project information
    • Activity
    • Labels
    • Members
  • Repository
    • Repository
    • Files
    • Commits
    • Branches
    • Tags
    • Contributors
    • Graph
    • Compare
  • Issues 1,547
    • Issues 1,547
    • List
    • Boards
    • Service Desk
    • Milestones
  • Merge requests 417
    • Merge requests 417
  • CI/CD
    • CI/CD
    • Pipelines
    • Jobs
    • Schedules
  • Deployments
    • Deployments
    • Environments
    • Releases
  • Packages and registries
    • Packages and registries
    • Package Registry
    • Infrastructure Registry
  • Monitor
    • Monitor
    • Incidents
  • Analytics
    • Analytics
    • Value stream
    • CI/CD
    • Repository
  • Wiki
    • Wiki
  • Snippets
    • Snippets
  • Activity
  • Graph
  • Create a new issue
  • Jobs
  • Commits
  • Issue Boards
Collapse sidebar
  • Meta
  • create-react-app
  • Merge requests
  • !3136

Feature/es6 module build

  • Review changes

  • Download
  • Email patches
  • Plain diff
Closed Administrator requested to merge github/fork/neeharv/feature/es6-module-build into master Sep 15, 2017
  • Overview 15
  • Commits 3
  • Pipelines 0
  • Changes 4

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 -

  1. Turning webpack.prod.js into a factory function that takes in target and returns different configs with varying targets
  2. We suffix the module build assets with .es6.js (this can be moved to config easily)
  3. For the ES6 build, we don't include polyfills
  4. We get 2 asset-manifests this way, and hence 2 different service workers that load the relevant built code
  5. Switch over to "uglifyjs-webpack-plugin": "^1.0.0-beta.2" so we can minify the ES6 code
  6. It currently only spits out the ES6 build 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.

Assignee
Assign to
Reviewers
Request review from
Time tracking
Source branch: github/fork/neeharv/feature/es6-module-build