文章参考阮一峰老师的博客,在这里表示感谢!
1、babel的安装
命令行安装
1、首先新建项目文件夹(mkdir+项目名称),cd 项目目录下,执行 npm init
一路回车创建package.json文件。(后面项目的配置信息都要在这里配置!)
接着执行以下命令:
2、在项目根目录创建.babelrc
配置文件,配置一下代码
{
"presets": ["latest"],//这里也可以使用"es2015"
"plugins": []
}
3、npm install --save-dev babel-preset-latest
安装最新的ES6转码规则
4、npm install --save-dev babel-cli
安装babel转码以及附带的工具到项目目录而不是全局安装,因为全局安装之后不能再不同项目里面使用不同版本的babel了。执行终端命令 mkdir src
创建资源文件夹,然后,改写package.json
。如下所示:
{
// ...
"devDependencies": {
"babel-cli": "^6.0.0"
},
"scripts": {
"build": "babel src -d lib"
},
}
//注意项目里面要有src目录(放要编译的ES6文件),
//因为脚本编译命令是从这个文件夹里寻找ES6文件的。否则编译失败!
到这里执行npm run build
命令就可以把src文件夹里面写好的ES6文件转码为ES5文件并且输出存放在lib文件夹中。
5、npm install babel-core
安装浏览器版本的构建工具
语法学习:
参考文章:30分钟掌握ES6/ES2015核心内容