大家都知道目前ＥＳ６不是瀏覽器全部都是支持的，所以要通過轉碼器先進行轉碼然后再編譯代碼。小心在學習ＥＳ６之前先安裝了ｂａｂｅｌ轉碼器，雖然當時安裝的時候困難重重，遺憾的是沒有把解決方案總結一下，別人詢問的時候又要重新查一次，汗！！廢話不多說了。。。。。。
babel安裝
如果你還沒安裝 Babel 可以使用 npm （用ｃｍｄ或者是git bash）來安裝：
npm install -g babel
但是一般都不會安裝成功，因為現在默認安裝的是babel6 所以這個命令不會成功。
現在使用es6的安裝方法：安裝babel-core和babel-cli
npm install babel-cli -gnpm install babel-core --save-dev
使用babel --help 查看是否已經安裝好了：沒有安裝成功一般都會提示安裝，這個時候建議換一個網速快的地方
一般安裝成功的話會有一大堆顯示出來，若是只有4、5行抱歉安裝失敗了。這個一般都是你的網速不行，可以換個
babel5 和 babel6 的區別
對於Babel來說，現在有了兩個版本，一個是5，一個是6，那么兩者有什么區別呢？
- 5對新手更加友好，因為只需要安裝一個
babel就可以了，而6需要安裝比較多的東西和插件才可以。 - 相比5來說，6將命令行工具和API分開來了，最直觀的感覺就是，當你想在代碼中運行es6代碼的話，需要安裝
babel-core，而如果你想在終端編譯es6或者是運行es6版本的REPL的話，需要安裝babel-cli - 也許有人問，原先的
babel去哪了？是這樣的，這個babel的package到了6版本之后雖然還是能安裝，但是已經不具有任何的有效的代碼了。取而代之的是一段提示文字，提示你需要安裝babel-core或者babel-cli。所以你在babel6的情況下，完全不需要安裝babel - 6將babel插件化，當你第一次安裝
babel-core並且按照以前的方式來加載require hook的話，你回發現代碼無法運行：require('babel-core/register');
就是因為babel6整體插件化了，如果你想使用es6語法，需要手動加載相關插件。
現在安裝babel的預編譯文件
自己新建一個文件夾
在文件下用git bash打開或者是cmd跳到當前文件夾下面
使用命令： npm install babel-preset-es2015 npm install babel-preset-react npm install babel-preset-stage-1
這時你會看到你的文件夾下面多了node_modules文件夾
接着寫它的配置文件.babelrc（與node_modules在同一目錄下）
因為這個文件是沒有命名的，所以要通過cmd創建文件命令：
fsutil file createnew d:\.babelrc 1000
這樣babel就可以使用了，可以自己創建一個js文件使用babel-node等命令測試一下
在git bash 上運行babel慢的要命，作為一個程序員是極度無法容忍的，所以推薦使用webstrom安裝插件使用或者是在sublime中配置編譯環境使用
創建Sublime Text編譯系統
選擇菜單Tools –> Build System –> new Build System…
中文版的話是工具 –> 編譯系統 –> 新建編譯系統…
然后寫如下配置：
{ "working_dir": "${project_path:${folder}}", "selector": "source.js", "encoding": "utf-8", "shell": true, "windows": { "cmd": ["taskkill /f /im node.exe >nul 2>nul & babel-node $file"] }, "osx": { "cmd": ["killall node >/dev/null 2>&1; babel-node $file"] }, "linux": { "cmd": ["killall node >/dev/null 2>&1; babel-node $file"] } }
|
接着保存為javascript.sublime-build，保存位置默認即可。
webstrom 默認使用babel
http://blog.drawable.de/2015/02/27/es6-in-webstorm-9-setting-up-a-filewatcher/