[TOC] ## 使用Babel編譯ES6 >1、 下載安裝Babel >環境：需要電腦上安裝node(node中一般都會自帶npm包管理器) >`npm install babel-cli -g` >`npm uninstall babel-cli -g` 之所以在命令行中能直接使用`babel命令`，是因為安裝在全局環境下之后，會生成一些xxx.cmd的文件，而這里的xxx就是可以在DOC窗口中執行的命令。  - babel.cmd - babel-node.cmd 開啟repl - ... 在執行babel命令后我們可以完成一些編譯或則其它任務，主要原因是執行babel命令后，會自動加載一些處理任務的文件 打開babel.cmd  ## 配置.babelrc文件，安裝一些語言解析包 >我們需要把.babelrc文件配置在當前項目的根目錄下 1、 我們需要把.babelrc文件配置在當前想項目的根目錄下（這個文件沒有文件名，后綴名是babelrc） 注意事項： - a： 在電腦上不能直接創建沒有文件名的文件，我們可以在webstorm中創建，或則使用命令創建 - b：babelrc這個后綴名在某些ws中是不識別的，它其實是一個json文件，我們需要在ws中配置一下（讓它隸屬于json文件）  （新版的webstorm不存在這個問題） 2、 添加配置 ``` //.babelrc { "presets":[] //=>存放的是我們編譯代碼時候需要依賴的語言包 ,"plugins":[] //=>存放的是，我們編譯代碼時候需要依賴的插件信息 } ``` >3、 安裝依賴的語言解析包 >在當前項目的根目錄下安裝（不是安裝在全局），需要特殊注意的是：要在當前項目根目錄中打開DOC命令才可以 >`npm install babel-preset-latest`安裝最新已經發布的語言標準解析模塊 >`npm install babel-preset-stage-2`安裝當前還沒有發布但是已經進入草案的語言解析模塊（如果你的代碼中用到了非正式發布的標準語法，我們需要安裝他） >... >安裝成功之后在當前根目錄下會存在一個`node-modules`文件夾，在這個文件夾中有我們安裝的模塊。 > >4、 完成最后.babelrc文件的配置 ``` { "presets":[ "lates" ,"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 監聽文件中代碼的改變，當代碼改變后，會自動進行編譯 ```