独立利用babel转换es6

这里笔者记录一下   之前一直是用webpack去帮助我们转换es6的语法  后来查找到独立的babel也可以完成，用后觉得可以 现在想记录下来  为以后的前端生活 垫一块砖

先安装全局的babel     cnpm install -g  babel-cli

然后进入一个盘符下  新建一个文件夹作为我们的项目 babelTest   

进入项目文件夹 后   生成package.json     （在cmd输入npm init）

先下载es5规则   cnpm install  babel-preset-es2015 -g

创建你的babel配置文件  .babelrc  （就在项目目录就可以了）

然后在你的配置文件里 添加上我们刚下载好的es5的规则

然后其实你就可以利用babel去转换了    

比如写一个test.js  里面是 es6的语法   

然后 可以在cmd里 输入  babel test.js  你就会看到转换后的es5语法的样子    当然我们还希望将转换后的代码 变成文件 

那么可以cmd后 输入  babel test.js  --out-file test2.js 这样转换后的代码就变成了文件存在了当前目录下

当然 还有时候 你需要转换的不止一个文件 我们要批量转换的时候  可以转换整个文件夹   

那么可以cmd后输入 babel   文件夹名 --out-dir 文件夹名  就会整个转换了  别忘了先建立要存放js的目标文件哦

这里单个文件转换 可缩写为  babel test.js -o test2.js  

       文件夹转换    可所写为  babel 文件夹名  -d  文件夹名

后话  当然我上面初始的cnpm init的package.json文件并没有使用  因为 我将 我的babel-cli 和 es2015都下载到了全局里

我们也可以下载到当前项目里  那么此时package.json就会记录这些模块的版本

还有 上面我只使用了es2015的模块 我们还可以使用很多      

        比如 react的转换模块   cnpm install  babel-preset-reack

        比如es7的转换模块       cnpm install babel-preset-stage-0/1/2/3   （0123选择一个，分别代表4个阶段）

当然 如果你是一个webpack的使用者，或者其他前端打包工具的使用者  你可以不单独使用babel  他们都集成在了这些打包工具里  你可以去学习了