简单编译es6

1.安装node环境
2.cd 到项目目录
3.打开命令行 输入 npm init -y 初始化
4npm install @babel/core @babel/cli @babel/preset-env下载编译的东西
5.打开项目目录编辑package.json文件
在这里插入图片描述

//package.json
{
  "name": "es6",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "scripts": {
  //通过babel编译 编译的目录为src -d指定输出的目录 ,这样src下面的所有js都会被编译到dest目录
    "build": "babel src -d dest"
  },
  "keywords": [],
  "author": "",
  "license": "ISC",
  "devDependencies": {
    "@babel/cli": "^7.8.4",
    "@babel/core": "^7.9.0",
    "@babel/preset-env": "^7.9.0"
  }
}

这里完成后我们还要生成一个配置文件,设置编译的规则
项目目录新键文件 .babelsrc
键入如下

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

我们在src目录新建main.js文件
键入如下测试代码

let a = 1;
let b = 2;
console.log(a+b);

命令行输入
npm run build
发现dest目录也生成main.js文件

//被编译后的js文件
"use strict";

var a = 1;
var b = 2;
console.log(a + b);

接下来我们的入口文件引入dest目录下的js文件即可,在编辑的时候我们还是修改src的js文件
谷歌浏览器正常显示
在这里插入图片描述
ie浏览器正常显示
在这里插入图片描述

原创文章 134 获赞 9 访问量 8779

猜你喜欢

转载自blog.csdn.net/weixin_45143481/article/details/105008920
今日推荐