發(fā)布于:2021-02-20 00:01:16
0
276
0
我們都喜歡ES6帶來(lái)的好處,你可以在《六個(gè)小巧但很棒的ES6功能》和《六個(gè)更小但更棒的ES6功能》中看到很多,比如原生類支持、箭頭函數(shù)和其他語(yǔ)言改進(jìn)。既然瀏覽器支持這些語(yǔ)法的增加,我們中的許多人都急于編寫ES6代碼,而對(duì)更新舊代碼的想法感到畏縮。維護(hù)……這不是很痛苦嗎?Lebab:一個(gè)將傳統(tǒng)JavaScript語(yǔ)法編寫的JavaScript轉(zhuǎn)換為明亮的ES6語(yǔ)法的項(xiàng)目!
Lebab的任務(wù)與Babel相反,它是一個(gè)易于使用的命令行實(shí)用程序。安裝該命令,然后像使用其他模塊一樣使用該命令:
$ npm install -g lebab
安裝了Lebab之后,您就可以開始將舊的JavaScript轉(zhuǎn)換為ES6 beauty。您可以轉(zhuǎn)換單個(gè)文件或整個(gè)文件模式:
# single file
$ lebab main.js -o main-es6.js --transform arrow
# pattern: .js files in `src/js`$ lebab --replace src/js/ --transform arrow
# pattern: used for any type of matching
$ lebab --replace 'src/js/**/*.jsx' --transform arrow
您必須指定一種轉(zhuǎn)換以應(yīng)用于舊版JavaScript文件:
# Use arrow functions instead of `function` keyword when possible
$ lebab main.js -o main-es6.js --transform arrow
# Use `let` and `const` instead of `var` when possible
$ lebab main-es6.js -o main-es6.js --transform let
# Use template strings instead of string concatenation
$ lebab main-es6.js -o main-es6.js --transform template
這是Lebab轉(zhuǎn)換JavaScript前后的快速介紹:
/*
BEFORE:
*/
// Let/const
var name = 'Bob', time = 'yesterday';
time = 'today';
// Template string
console.log('Hello ' + name + ', how are you ' + time + '?');
var bob = {
// Object shorthand
name: name,
// Object method
sayMyName: function () {
console.log(this.name);
}
};
/*
AFTER:
*/
// Let/const
const name = 'Bob';
let time = 'yesterday';
time = 'today';
// Template string
console.log(`Hello ${name}, how are you ${time}?`);
const bob = {
// Object shorthand
name,
// Object method
sayMyName() {
console.log(this.name);
}
};
令人沮喪的是,您一次只能通過(guò)命令行執(zhí)行一次轉(zhuǎn)換,因此,如果您想使事情變得更快,可以使用編程API:
import lebab from 'lebab';
const {code, warnings} = lebab.transform('var f = function(){};', ['let', 'arrow']);
console.log(code); // -> "const f = () => {};"
有關(guān)轉(zhuǎn)換的列表,其可靠性甚至可以做出貢獻(xiàn),請(qǐng)查看Lebab GitHub頁(yè)面。
Lebab是一個(gè)了不起的項(xiàng)目,可以為我們節(jié)省很多人工維護(hù)。您是否應(yīng)該盲目地相信Lebab帶來(lái)的一切?可能不會(huì)。甚至最簡(jiǎn)單的Lebab轉(zhuǎn)型也會(huì)使我們的生活更輕松嗎?
作者介紹
熱門博客推薦