你必須瞭解有關Babel 6的6件事
阿新 • • 發佈：2019-02-09
從去年開始，Babel成為了一個將ES2015和JSX轉換為無趣古老的javascript語言的標配轉換工具。但是一夜之間，Babel 6 改變了這一切。原先的Babel元件已經被取締了，執行babel不再起作用。同時，原先版本的說明文件也已經消失不見了。
別擔心！為了讓你快速上手，我將列出新版本中的6個最重要的變化。如果需要更多的幫助，可以檢視。在這篇文章中將詳細介紹Babel 6的細節，包括CLI、Webpack、Mocha和Gulp。
1. 原先的Babel包將不再可用，取而代之的是諸多的包
babel-cli，包含了Babel的相關命令列介面；babel-core，包含了Node API和require鉤子；babel-pollfill，俗稱墊片，可以創在一個完全適合ES2015執行的環境。
為了避免出現衝突，需要確保從package.json中移除所有原始版本的Babel包，包括babel、babel-core等，然後使用npm uninstall解除安裝。
2. 任何一個簡單的轉換都是一個外掛，包括ES2015和JSX
所以，原先的命令將不在起任何作用，需要安裝相應的功能外掛後才能生效。實際上，ES2015包括大概20個外掛，你並不需要一個一個的去安裝。
3. Babel 6增加了預處理或者外掛集
在Babel 5中，預先增加了babel-preset-es2015
babel-preset-react兩個外掛。而在Babel 6中，我們需要自行安裝。 npm install babel-preset-es2015 babel-preset-react --save-dev
即使安裝了預處理外掛，你仍然需要告訴Babel去使用此外掛。
4. .babelrc是必須的
由於Babel預設不再使用ES2015和React轉換，那麼使用require鉤子的gulpfile.babel.js和Mocha將無法使用。你需要在專案目錄增加.babelrc檔案來解決此問題。
{ "presets": ["es2015", "react"] }
5. Stage 0 是一個單獨的預處理，而不是一個選項
以前，你可以通過傳遞引數--stage 0 給Babel來使得ES7的相關特效能夠使用，比如async / await。但是現在，你需要安裝babel-preset-stage-0才能使用了。
6. --external-helpers引數的相關功能也變成了一個外掛。
為了避免重複引入Babel的helper函式，我們需要單獨安裝和使用babel-plugin-transform-runtime外掛，然後將babel-runtime包加入到你的程式碼中（即使你已經使用了墊片程式碼）。