学习笔记"/>
Nodejs学习笔记
课程来源:B站up主-首席bug专家 首席bug专家的个人空间-首席bug专家个人主页-哔哩哔哩视频
Babel是一个广泛使用的ES6转码器,可以将ES6代码转为ES5代码,从而在老版本的浏览器执行。这意味着,你可以用ES6的方式编写程序,又不用担心现有环境是否支持。
浏览器支持性查看
Can I use... Support tables for HTML5, CSS3, etc
Babel官网
Babel · Babel
转码示例
原始代码用了箭头函数,Babel将其转为普通函数,就能在不支持箭头函数的JavaScript环境执行了
//转码前
input. map(item => item + 1);//转码后
input.map(function (item) {return item + l;
});
Babel安装流程
第一步:安装Babel
安装在项目的根目录下
//如果配置了淘宝镜像可直接使用npm
npm install --save-dev @babe1/ core
//若下载了 cnpm也可如下
cnpm install --save-dev @babe1/ core
第二步:配置文件
Babel的配置文件是.babelrc,存放在项目的根目录下。使用Babel的第一步,就是配置这个文件。该文件用来设置转码规则和插件,基本格式如下
{"presets": [],"plugins": []
}
第三步:转码规则
presets字段设定转码规则,官方提供以下的规则集,你可以根据需要安装
npm install --save-dev @babel/preset-env
第四步:将规则加入.babelrc
{"presets": ["@babel/env"],"plugins": []
}
Babel命令行转码
Babel提供命令行工具@babelcli,用于命令行转码
npm install --save-dev @babel/cli
#转码结果输出到标准输出
$ npx babel example.js# 转码结果写入一个文件
# --out-file 或-o参数指定输出文件
$ npx babel example.js --out-file compiled.js
#或者
$ npx babel example.js -o compiled.js#整个目录转码
#--out-dir或-d参数指定输出目录
$ npx babel src --out-dir lib
#或者
$ npx babel src -d lib
更多推荐
Nodejs学习笔记
发布评论