webpacker: babel-polyfill is not included/loaded

I think an easy change would be to indicate in the default javascript/packs/application.js that you need to include import "babel-polyfill". Otherwise the useBuiltIns option doesn’t do anything since it transforms the import statement, but doesn’t inject one.

References: https://github.com/babel/babel-preset-env#usebuiltins

I corrected this by changing the /config/webpack/shared.js to have entry paths that include the polyfill:

module.exports = {
  entry: packPaths.reduce((map, entry) => {
    const localMap = map
    const namespace = relative(join(entryPath), dirname(entry))
    localMap[join(namespace, basename(entry, extname(entry)))] = ['babel-polyfill', resolve(entry)]
    return localMap
  }, {}),
  ...
}

As @adamsanderson said, you need import 'babel-polyfill' to use polyfill.

Including babel-polyfill in webpack entry like @lsanwick said is not suitable. Because they will include multiple duplicated polyfills when users use multiple packs in a view.

When users use multiple packs at the same time, only one pack should import polyfill otherwise polyfill is overlapped. Or when users use each pack separately, which means one pack at a view, each one should import polyfill.

Here’s my .babelrc:

{
  "presets": [
    [
      "env",
      {
        "modules": false,
        "targets": {
          "browsers": "> 1%",
          "uglify": true
        },
        "useBuiltIns": true
      }
    ],
    "react"
  ],
  "plugins": [
    "syntax-dynamic-import",
    [
      "transform-class-properties",
      {
        "spec": true
      }
    ]
  ]
}

So I guess I should follow @lsanwick’s setup? The .babelrc above is what I get after webpack:install:react so I’m not sure why this isn’t all enabled by default.