【笔记】Webpack打包JS文件

发表于 更新于 阅读次数：

前言

Webpack通过babel-loader插件实现JS语法降级

下载依赖

  • babel-loader包含@babel/core，无需重复引入
1
npm install -D babel-loader @babel/preset-env

修改配置文件

全部写在Webpack配置文件内

webpack.config.js
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
module.exports = {
  module: {
    rules: [
      {
        test: /\.js$/,
        use: [
          {
            loader: "babel-loader",
            options: {
              presets: [
                "@babel/preset-env"
              ],
              plugins: []
            }
          }
        ]
      }
    ]
  }
};

写在单独的Babel配置文件内

babel.config.js
1
2
3
4
5
6
module.exports = {
  presets: [
    "@babel/preset-env"
  ],
  plugins: []
};

完成