Babel 是什麼?
官網:https://www.babeljs.cn/
- Babel 是一個 JavaScript 編譯器
- Babel 是一個工具鏈,主要用於將 ECMAScript 2015+ 版本的代碼轉換爲向後兼容的 JavaScript 語法,以便能夠運行在當前和舊版本的瀏覽器或其他環境中。
語法轉換
通過 Polyfill
方式在目標環境中添加缺失的特性 (通過 @babel/polyfill 模塊) 源碼轉換 (codemods)
// Babel 輸入: ES2015 箭頭函數
[1, 2, 3].map((n) => n + 1);
// Babel 輸出: ES5 語法實現的同等功能
[1, 2, 3].map(function(n) {
return n + 1;
});
整個配置過程包括:
1、運行以下命令安裝所需的包(package):
npm install @babel/core @babel/cli @babel/preset-env --save-dev
npm install --save @babel/polyfill
1.@babel/core:babel核心庫
2.@babel/cli:執行babel命令
3.@babel/preset-env:裝了所有es6轉化es5的規則
4.@babel/polyfill:補充低版本缺失的內容,如promise對象
2、新建一個.babelrc文件(一定是這個名字)
{
"presets": [
"@babel/preset-env"
],
"plugins": [] //這個是配置插件的可以不寫
}
執行:建一個a.js文件
let a=123;
setTimeOut(()=>{
console.log(123);
})
在命令行中輸入以下命令
npx babel a.js -o b.js
//-o // output:輸出
//-d // dir : 目錄
以上命令表示把a.js文件中的內容轉換成es5輸出到b.js文件中 得到b.js
var a=123;
setTimeOut(function(){
console.log(123);
})
另外,npm允許在package.json文件中,使用script字段定義腳本命令
"scripts": {
"o": "babel index2.js -o index-target.js"
},
然後,再命令行用npm run 命令,執行這段代碼
npm run o
強制清除node緩存
npm cache clean --force
結束語:
男孩子要好好學習提升自己,喝酒有品,好色有度,不是自己的女人不要碰,唯有父母和前途不可辜負。