使用Bale编译ES6

使用Bale编译ES6

@(Babel)

一.下载安装Babel
环境：需要电脑上安装node(node中一般队徽自带npm包管理器)
npm install babel-cli -g把模块安装在全局环境下 在任何项目中都可以使用命令来编译我们的代码了
npm uninstall babel-cli -g把全局下安装的babel模块卸载掉
我们观看安装目录发现一些需要了解的知识点：
1、我们后期之所以可以使用babel的命令，是因为安装在全局环境下之后，会生成一些xxx.cmd的文件，而这里的xxx.cmd就是可以再doc窗口中执行的命令
bable.cmd 以后可以使用babel命令了
babel-node.cmd
…
2、执行babel命令后我们可以完成一些编译或者其他的任务，主要原因是执行babel命令后，会自动加载一些处理任务的文件
二、配置.babelre文件，安装一些语言解析包
我们需要把.babelrc文件配置在当前项目的根目录下(这个文件没有文件名，后缀名是babelrc)
a:在电脑上不能直接创建没有文件名的文件，我们需要使用VSC、WS创建，或者使用命令创建
b：babelrc这个后缀名在某些ws当中是不识别的、他其实是一个json文件，我们需要在ws当中配置一下(让它隶属于json文件)

2.在文件当中编写一些内容

{
  "presets": [],//存放的是我们编译代码时需要依赖的语言解析包
  "plugins": []//存放的是我们编译代码时候需要依赖的插件信息
}

3、安装依赖的语言解析包
在当前项目的根目录下安装 (不是安装在全局) 需要特殊注意的是要在当前项目的根目录中打开doc命令才可以
npm install babel-preset-latest安装最新已经发布的语言标准解析模块
npm install babel-preset-stage-2安装当前还没发布但是已经进入草案的语言解析模块(如果你的代码中用到了发布非标准的语言，我们需要安装他)
安装成功后在自己的当前项目的根目录下，会存在一个node_modules文件夹，在这个文件夹中有我们安装的模块

4、完成最后.baelrc配置

    {
  "presets": [
    "latest",
    "stage-2"
  ],
  "plugins": []
}

三、使用命令编译JS代码
基本上所有支持命令操作的模块都有一个命令
babel --help / babel -h 查看帮助
babel --version / babel -V 查看版本号
babel --out-file /babel -o 把某一个JS文件中的ES6代码进行编译
babel --out-dir / babel -d 把某一个文件夹中所有的JS文件中的ES6代码进行编译
babel --watch /babel -w 监听文件中代码的改变 当代码改变后会自动进行编译
结束监听的程序ctrl+c 倆遍