ECMAScript 6学习记录之先导篇-babel工具的使用

文章参考阮一峰老师的博客,在这里表示感谢!
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核心内容

你可能感兴趣的:(ECMAScript 6学习记录之先导篇-babel工具的使用)