babel编译js文件

简介: babel编译js文件
# 安装
$ cnpm install --save-dev @babel/core @babel/cli

# 转换
$ ./node_modules/.bin/babel script.js
# 或者
$ npx babel script.js

要编译的文件

script.js

[1, 2, 3].map(n => n + 1);

要编译的文件

script.js

# 编译(发现没有变化)

$ npx babel script.js
[1, 2, 3].map(n => n + 1);


# 安装插件
$ cnpm i -D @babel/plugin-transform-arrow-functions


# 指定插件
$ npx babel script.js --plugins=@babel/plugin-transform-arrow-functions

[1, 2, 3].map(function (n) {
return n + 1;
});

常用参数

–out-file/-o 指定输出文件名

–watch/-w 监控文件变化

–out-dir/-d 指定输出文件夹

使用presets

preset-env 处理es6+规范语法的插件集合

$ cnpm install --save-dev @babel/preset-env

新建配置文件 babel.config.json

{
"presets": [
[
"@babel/env"
]
]
}

编译测试

demo.js

var name = () => {};
$ npx babel demo.js

编译结果

"use strict";

var name = function name() {};

参考

https://babeljs.io/docs/en/babel-cli

Babel 配置用法解析

            </div>
目录
相关文章
|
5天前
|
JavaScript
js的插件
js的插件
11 1
|
9月前
|
Web App开发 JSON JavaScript
js常见的报错
js常见的报错
49 0
|
9月前
|
JavaScript 前端开发 算法
JS的解析与Js2Py使用
Js2Py是一个Python库,用于将JavaScript代码转换为Python代码,并在Python环境中执行JavaScript。
151 1
|
9月前
|
JavaScript 内存技术
如何直接运行 .js 文件
如何直接运行 .js 文件
234 0
|
10月前
|
JavaScript 前端开发 Ruby
打包出来的 common.js/umd.js 是啥?
打包出来的 common.js/umd.js 是啥?
120 0
|
监控 JavaScript
babel编译js文件
babel编译js文件
158 0
|
JavaScript
js文件中引入另一个js文件
js文件中引入另一个js文件
77 0
|
JavaScript
2秒拿到某个库的js文件
2秒拿到某个库的js文件
80 0
|
9月前
|
XML 数据可视化 Android开发
流程图绘制
经典工具:Flowable Eclipse Designer
132 0
|
9月前
|
前端开发 JavaScript 数据库
获取省市区列表【项目 商城】
获取省市区列表【项目 商城】
203 0