Webpack tree-shaking 可以删除未使用的 babel-polyfills 吗？答案

【问题标题】：Can Webpack tree-shaking remove unused babel-polyfills?Webpack tree-shaking 可以删除未使用的 babel-polyfills 吗？
【发布时间】：2018-04-29 21:08:11
【问题描述】：

我尝试让 webpack tree-shaking 删除未使用的 babel-polyfill。

index.js 文件包含：

import 'babel-polyfill'
const add4 = n => n + 4
const add5 = n => n + 5
add4(6)

console.log('boom', add4(4))

在这个文件中没有代码需要任何 es2015+ polyfill，所以我希望 tree-shaking 可以删除捆绑输出中未使用的 babel-polyfill。事实并非如此，并且捆绑包仍然包含它们（缩小）。

Here is a git repo with this code。

webpack 配置：

const MinifyPlugin = require('babel-minify-webpack-plugin')

module.exports = {
  entry: './index.js',
  output: {
    filename: 'bundle-webpack.js'
  },
  module: {
    rules: [
      {
        test: /\.js$/,
        exclude: /node_modules/,
        use: {
          loader: 'babel-loader'
        }
      }
    ]
  },
  plugins: [
    new MinifyPlugin({ mangle: { topLevel: true } }, { comments: false })
  ]
}

和.babelrc:

{
  "presets": [
    [
      "env",
      {
        "targets": {
          "browsers": ["chrome >= 50", "iOS >= 10", "ie >= 8"]
        },
        "useBuiltIns": true,
        "modules": false,
        "loose": true
      }
    ]
  ]
}

我尝试将babel-minify-webpack-plugin 替换为uglifyjs-webpack-plugin，但结果相同。

如何使 tree-shaking 工作，并且输出不包含任何未在原始代码中使用的babel-polyfills？

【问题讨论】：

标签： webpack babel-polyfill babel-loader tree-shaking

【解决方案1】：

现在我意识到 babel-polyfill 修改了 tree-shaking 可能没有影响的全局范围......

这是一个愚蠢的问题:)

【讨论】：