Ti z vás, kteří sledují tento blog, vědí, že ne každý blogový příspěvek je podporou určité techniky, ale pouze návodem, jak něčeho dosáhnout. Někdy popsaná technika pravděpodobně není něco, co byste měli dělat. Toto je jeden z těchto blogových příspěvků.
Babel parser je v dnešní době základním nástrojem ve webovém zásobníku. Babel nám pomáhá používat vzory JavaScriptu předtím, než se dostanou do prohlížeče (volitelné řetězení), stejně jako JSX pro React. To mě přivedlo k zamyšlení:jak snadné by bylo napsat rozšíření Babel, které nám umožní používat alias klíčových slov, jako je fn místo function ? Pojďme se podívat!
Vytvoření aliasu klíčového slova pomocí Babel je jednodušší a obtížnější, než byste si pravděpodobně mysleli. Jednoduše řečeno, je to v podstatě jen jeden řádek kódu. Na druhou stranu musíte upravit kód základního analyzátoru Babel.
Jako náš příklad řekněme, že chceme alias fn pro JavaScript function klíčové slovo. Příklad fragmentu kódu by vypadal takto:
// Named function
fn myFunction() {
return true;
}
// Function as variable
const myOtherFunction = fn() {
}
// Instantly executing function
(fn() {
})();
Po analýze bychom chtěli všechny instance fn bude nahrazeno function . Abychom vytvořili tento alias, museli bychom upravit createKeyword následující soubor v
// File: packages/babel-parser/src/tokenizer/types.js
// We'll be adding one line
// ...
function createKeyword(name: string, options: TokenOptions = {}): TokenType {
options.keyword = name;
const token = new TokenType(name, options);
keywords.set(name, token);
// ADD THIS LINE:
if (name === "function") keywords.set("fn", token);
return token;
}
// ...
K analýze ukázkového souboru mohu spustit:
node packages/babel-parser/bin/babel-parser.js /path/to/sample-file.js
Analyzátor poskytne následující, když narazí na instanci fn :
{
"type": "FunctionDeclaration",
"start": 0,
"end": 36,
"loc": {
"start": {
"line": 1,
"column": 0
},
"end": {
"line": 3,
"column": 1
}
},
"id": {
"type": "Identifier",
"start": 3,
"end": 13,
"loc": {
"start": {
"line": 1,
"column": 3
},
"end": {
"line": 1,
"column": 13
},
"identifierName": "myFunction"
},
"name": "myFunction"
}
// ...
Pravděpodobně si říkáte "proč bych to kdy dělal?!" No, to byste asi neudělali – úprava zdrojové knihovny pro vlastní použití je noční můrou údržby a používání nečestných klíčových slov ve vašem zdroji....je také noční můrou údržby.
Vše, co bylo řečeno, pokud chcete experimentovat s přidáváním vlastních aliasů klíčových slov, je nejlepší volbou upravit zdroj Babel. Byl bych rád, kdyby existoval způsob, jak napsat rozšíření, které toho dosáhne. Velké poděkování patří Loganu Smythovi za pomoc při navigaci ve zdroji Babel!