欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页

babel转换器

程序员文章站 2022-05-19 15:30:20
...

babel转换器

Babel 是什么?

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 --save-dev @babel/core @babel/cli @babel/preset-env
npm install --save @babel/polyfill
[email protected]/core:babel核心库

[email protected]/cli:执行babel命令

[email protected]/preset-env:装了所有es6转化es5的规则

[email protected]/polyfill:补充低版本缺失的内容,如promise对象
.babelrc
 "presets": [
        "@babel/preset-env"
    ],
    "plugins": ["@babel/plugin-transform-arrow-functions", "@babel/plugin-transform-block-scoping"]
index.js

require("@babel/polyfill");
"plug": "babel --plugins @babel/plugin-transform-arrow-functions index.js -o index-target.js",
"block": "babel --plugins @babel/plugin-transform-block-scoping index.js -o index-target.js",
"o": "babel index.js -o index-target.js"

强制清除node缓存

npm cache clean --force