前端詞典 關於 Babel 你必須知道的

2021-09-25 11:55:15 字數 1305 閱讀 9386

// 模板字面量	

const name = '小生方勤';

let hello = `hello $`;

// .babelrc 檔案	

plugins 與 presets 同時存在的執行順序

先執行 plugins 的配置項,再執行 preset 的配置項;

plugins 配置項,按照宣告順序執行;

preset 配置項,按照宣告逆序執行。

transform-es2015-template-literals

stage-2

env

// .babelrc 檔案	

], "stage-2"]

}

:"usage"

能夠把 babel-polyfill 中你需要用到的部分提取出來,不需要的去除。

false: 不對 polyfills 做任何操作

entry: 根據 target 中瀏覽器版本的支援,將 polyfills 拆分引入,僅引入有瀏覽器不支援的 polyfill

usage(新):檢測**中 es6/7/8 等的使用情況,僅僅載入**中用到的 polyfills

babel test.js -o compiled.js

使用 babel-polyfill 會導致打出來的包非常大,很多其實沒有用到,對資源來說是一種浪費。

babel-polyfill 可能會汙染全域性變數,給很多類的原型鏈上都作了修改,這就有不可控的因素存在。

:"usage"

這個引數值就可以實現按需載入 babel-polyfill 啦。

]	

] }

方案

優點缺點

@babel/runtime & @babel/plugin-transform-runtime

按需引入, 打包體積小

不能相容例項方法

@babel/polyfill

完整模擬 es2015+ 環境

打包體積過大, 汙染全域性物件和內建的物件原型

@babel/preset-env

按需引入, 可配置性高

小生不知 -_-

babel-cli —> @babel/cli。

babel-preset-env —> @babel/preset-env

接下來我會專門寫一篇關於開發環境配置的問題,也就是自己完成腳手架的功能,所以這裡就不提如何配置 babel 啦。

你必須知道的關於tcp keepalive 設定

1.引數設定 檢視相關的引數 sysctl a grep tcp keepalive net.ipv4.tcp keepalive intvl 30 net.ipv4.tcp keepalive probes 2 net.ipv4.tcp keepalive time 160 設定相關的引數 sys...

關於 Linux shell 你必須知道的

我個人很喜歡使用 linux 系統,雖然說 windows 的圖形化介面做的確實比 linux 好,但是對指令碼的支援太差了。一開始有點不習慣命令列操作,但是熟悉了之後反而發現移動滑鼠點點點才是浪費時間的罪魁禍首。那麼對於 linux 命令列,本文不是介紹某些命令的用法,而是說明一些簡單卻特別容易讓...

作為前端製作師你必須知道的事情!

前台頁面製作多了,你就應該了解很多問題存在。你與程式要打交道你還要與ui打交道,你是乙個中間的過渡人,設計可以不考慮程式怎麼取出方便怎麼做合理,你得考慮,同時你還要考慮。扯得太遠了,我們還是說近的吧 不知道是不是我out了,最近做東西的時候要使用優先級別 下面是乙個例子轉的,不過也能說明一些東西 很...