es6学习记录

Posted 2020-08-31

 

工具Babel，将es6转es5

配置文件名称   .babelrc

内容

{

"presets":[],

"plugins":[]

}

npm

ES2015

npm install --save-dev babel-preset-es2015

react

npm install --save-dev babel-preset-react

es7不同阶段语法提案转码4个阶段

npm install --save-dev babel-preset-stage-0

npm install --save-dev babel-preset-stage-1

npm install --save-dev babel-preset-stage-2

npm install --save-dev babel-preset-stage-3

命令行转码

npm install  --global babel-cli

 

# 转码结果输出到标准输出
$ babel example.js

# 转码结果写入一个文件
# --out-file 或 -o 参数指定输出文件
$ babel example.js --out-file compiled.js
# 或者
$ babel example.js -o compiled.js

# 整个目录转码
# --out-dir 或 -d 参数指定输出目录
$ babel src --out-dir lib
# 或者
$ babel src -d lib

# -s 参数生成source map文件
$ babel src -d lib -s

另一种方法是改写package

如我的实际运行的package.json如下

{
  "name": "bebal",
  "version": "1.0.0",
  "devDependencies": {
    "babel": "^6.5.2",
    "babel-cli": "^6.22.2",
    "babel-preset-es2015": "^6.22.0",
    "babel-preset-react": "^6.23.0"
  },
  "scripts":{
    "build":"babel src -d lib"
   //请注意这是是根据实际情况指定目录的
  }
}

　　进行转码的时候只要

$npm run build

github es6新特性

es6新特性实际案例和对应es5案例对比

es6支持特性