Babel 把用最新標準編寫的 JavaScript 代碼向下編譯成可以在今天隨處可用的版本。 這一過程叫做“源碼到源碼”編譯， 也被稱為轉換編譯。

通俗的說，就是我們可以用ES6, ES7等來編寫代碼，Babel會把他們統統轉為ES5。

• babel-core 調用Babel的API進行轉碼
• babel-loader 用來告訴webpack我想要對我的js代碼進行兼容性編譯，起到一個通知者角色
• babel-preset-env 用于解析 ES6
• babel-preset-react 用于解析 JSX
• babel-preset-stage-0 用于解析 ES7 提案

npm install --save-dev babel-core babel-loader babel-preset-env babel-preset-react babel-preset-stage-0

創建.babelrc

//.babelrc {"presets":["react","env","stage-0"] } {test:/(\.jsx|.js)$/,use:{loader:'babel-loader',options:{// babel-loader 將使用默認的緩存目錄node_modules/.cache/babel-loader,之后的 webpack 構建，將會嘗試讀取緩存，來避免在每次執行時，可能產生的、高性能消耗的 Babel 重新編譯過程cacheDirectory:true}},exclude:/node_modules/,include: path.join(__dirname, 'src')

總結

以上是生活随笔為你收集整理的如何用babel将ES6转换的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。