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>
目录
相关文章
|
3月前
|
前端开发 开发者
深入解析Vite.js源码
【7月更文挑战第1天】Vite.js 深入解析:以其无bundle开发、动态ES模块加载提升开发效率;本地HTTP服务器配合WebSocket实现热更新;按需加载减少资源占用;预构建优化生产环境性能;基于Rollup的插件系统增强灵活性。Vite,一个创新且高效的前端构建工具。
61 0
|
5月前
|
JSON JavaScript 前端开发
js的版本
【5月更文挑战第7天】js的版本
43 1
|
5月前
|
JavaScript
js的插件
js的插件
32 1
|
Web App开发 JSON JavaScript
js常见的报错
js常见的报错
78 0
|
JavaScript 前端开发 Ruby
打包出来的 common.js/umd.js 是啥?
打包出来的 common.js/umd.js 是啥?
207 0
|
5月前
|
敏捷开发 人工智能 开发者
Code Smell 重构你的日常代码-圈复杂度高多层嵌套
圈复杂度是一种代码复杂度指标,用于衡量代码中条件分支的数量,数值越高表示代码越复杂,测试和维护难度越大。在不断迭代的代码中,过多的条件判断可能导致难以理解和维护的"气功波"代码。为了解决这个问题,可以采用重构策略,比如使用卫语句减少嵌套、遵循单一职责原则使函数功能更专注、通过抽象解析器模型实现关注点分离以及确保代码在同一抽象层次等。通过这些方法,可以提高代码的可读性和可维护性,降低复杂性,从而改善代码质量。
|
5月前
|
安全 网络安全 数据安全/隐私保护
BUUCTF:Misc 解析(八)
BUUCTF:Misc 解析(八)
|
JavaScript
2秒拿到某个库的js文件
2秒拿到某个库的js文件
96 0
|
监控 JavaScript
babel编译js文件
babel编译js文件
176 0
|
JavaScript
js文件中引入另一个js文件
js文件中引入另一个js文件
94 0