Babel7的简单使用

初始化

新建一个空文件夹,空文件夹下cmd npm init -y初始化一个新项目

安装Babel依赖

  • @babel/cli
    用于在命令行编译文件 官方文档地址
  • @babel/core
    Babel的核心,各种转换的方法都写在这里 官方文档地址
  • @babel/preset-env
    智能的编译js,只需要指定你要支持的浏览器范围,就可以智能的编译。 官方文档地址
npm install @babel/cli @babel/core @babel/preset-env --save-dev

添加配置文件

.babelrc

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

.browserslistrc 用于指定编译后的js支持的浏览器范围

"> 1%"

package.json的scripts中添加

"babel": "babel src --out-dir dist --watch"

添加测试文件

新建一个src文件夹,在文件夹中添加test.js,写一点es7的代码

function box(){
    
    
	new Promise((resolve,reject)=>{
    
    
		setTimeout(()=>{
    
    
			return resolve(135300)
		})
	})
}

async function test(){
    
    
	let a = await box()
}
console.log(test())

文件目录

在这里插入图片描述

运行

npm run babel

在这里插入图片描述
查看dist/test.js文件可以看到编译后的js
在这里插入图片描述

猜你喜欢

转载自blog.csdn.net/weixin_35958891/article/details/107372399