vue3+ts学习（十）：Babel在webpack中的使用

Babel:将ES6+的代码转换为向后兼容版本的代码

// @babel/core:babel的核心代码，必须安装
// @babel/cli:可以让我们在命令行使用Babel
npm install @babel/core @babel/cli -D
// 需要下载预设@babel/preset-env，借助插件进行兼容转化
npm install @babel/preset-env -D

// 通过命令行转化demo.js里的ES6代码输出到dist文件下
npx babel demo.js --out-dir dist --presets=@babel/preset-env

在webpack使用babel需要下载babel-loader

// webpack.config.js
module:{
    rules:[
      // ...
      {
        test: /\.js$/,  
        loader:"babel-loader",
      }
    ]
  }
  
// 跟postcss一样，在根目录新建个babel.config.js配置插件
module.exports = {
  presets:[
    "@babel/preset-env"
  ]
}