學習babel轉碼器
阿新 • • 發佈:2022-06-01
Babel轉碼器
Babel定義
Babel 是一個廣泛使用的 ES6 轉碼器,可以將 ES6 程式碼轉為 ES5 程式碼,從而在老版本的瀏覽器執行
Babel安裝
僅需要在專案檔案下安裝
npm install --save-dev @babel/core
Babel轉碼流程
一:配置.babelrc檔案 建立.babelrc檔案設定轉碼規則和外掛 格式:{ "presets": [],//轉碼規則 "plugins": [] } 二:安裝轉碼規則 presets欄位設定轉碼規則 轉碼規則: npm install --save-dev @babel/preset-env //最新規則 npm install --save-dev @babel/preset-react //react 轉碼規則 三:將轉碼規則加入presets欄位 { "presets": [ "@babel/env", "@babel/preset-react" ], "plugins": [] } 四:命令列轉碼 1.安裝babel命令列工具 $ npm install --save-dev @babel/cli 2.轉碼用法 npx babel example.js //轉碼js檔案 npx babel example.js -o compiled.js //將js檔案轉碼到指定檔案輸出 npx babel src -d 資料夾名 //轉碼整個資料夾
Babel轉碼注意事項
Iterator、Generator、Set、Map、Proxy、Reflect、Symbol、Promise等全域性物件Babel不會轉碼
Babel可轉碼的語法可參考(https://www.babeljs.cn/)Babel官網