How to use transform-runtime in Webpack 2?

Question

Frontend

Good afternoon!
Faced the following problem:
After migrating to Webpack 2, I discovered that webpack no longer contains polyfills for some ES6 features, such as Promise, and you need to add them yourself.
When using transform-runtime, the necessary polyfills are added, but the node_modules folder in the config is in the exceptions for babel-loader, otherwise at least the build slows down significantly.
And, if the imported code from node_modules contains ES6 and higher - transform-runtime does not process this code, which is certainly expected, but at the same time leads to critical errors in browsers that do not support these features.
For the solution, I had to use babel-polyfill, but this plugin carries a lot of extra code, which can be avoided using transform-runtime.
Has anyone encountered such a problem?

Answer 1

Just use include instead of exclude , everything is simple, add the source folder and the necessary folders from node_modules! Get rid of code duplication https://babeljs.io/docs/plugins/external-helpers/ console

//...
{
  plugins: [
    new webpack.ProvidePlugin({
      babelHelpers: '!!./src/js/babel/external-helpers.js'
    })
  ]
  , module: {
    rules: [{
      test: /\.js$/
      , include: [
        path.join(__dirname, `src`)
        , path.join(__dirname, `node_modules`, `bootstrap`, `js`, `src`)
      ]
      , use: [{
        loader: `babel-loader`
        , options: {
          presets: [
            [`latest`, {
              'modules': false
            }]
          ]
          , plugins: [
            `external-helpers`
          ]
        }
      }]
    }]
  }
}