ES6转ES5环境搭配

Posted 2021-02-05 wenxuehai

1、初始化项目

在项目根目录创建 package.json 文件

npm init  //或者 npm init -y

2、安装babel-cli脚手架

npm install babel-cli --save

3、配置文件.babelrc

在项目根目录新建文件，命名为：.babelrc.（注意：以点开头且以点结束的文件，即文件没有扩展名）

3.1、设定转码规则

npm install --save-dev babel-preset-latest
//或者 npm install --save-dev babel-preset-es2015

3.2、设置.babelrc的presets

{
  "presets": [
  　　‘latest‘  //或者es2015或者env，总之对应自己安装的转码规则，
  ],
  "plugins": []
}

4、设置相应的scripts脚本：在package.json中设置,（将src文件夹下的js文件，编译转码到dist文件夹下）

 "scripts": {
    "build": "babel src -d dist"
  }

5.转码运行

在项目根目录下的命令行中运行转码，转码运行后将在dist文件夹下生成 es6 转码后生成的 es5 文件，然后可以在程序中引用 es5 文件。

npm run build