如何在webpack中用babel转换js？

Question

目标是把es6转化为es5 可以用uglifyjsWebpackPlugin来压缩代码

webpack.config.js中module.exports.module.rules是这样定义loader的：

{
                test: /\.js$/,
                loader: 'babel-loader',
                options: {
                    babelrc: false,
                    plugins: [
                        "dynamic-import-webpack"
                    ]
                },
                exclude: /node_modules/
            },

根目录下是这样写babelrc的：

{
  "presets": ["es2015"]
}

但是不起作用 还是没有转化为es5的标准

该怎么做？

Answer 1

module.exports = {
    // ...
    module: {
        rules: [
            {
                test: /\.js$/,
                exclude： /node_modules/,
                use: {
                      loader: "babel-loader",
                      options: {
                        presets: ["@babel/preset-env"]
                      }
                }
              }
        ]
    }
}

uglifyjs-webpack-plugin插件你通过官网查看配置https://github.com/webpack-contrib/uglifyjs-webpack-plugin。

babel的配置你也可以通过官网https://babeljs.io/setup#installation查看，选择对应的配置即可。