使用babel把es6语法转换成es5

Babel 是什么

Babel 是一个工具链，主要用于将 ECMAScript 2015+ 版本的代码转换为向后兼容的 JavaScript 语法，以便可以运行在当前和旧版本的浏览器或其余环境中。

Babel能用在哪里

NodeJs

使用 npm 初始化项目

$ mkdir es6-to-es5
$ npm init -y

安装Babel

$ npm install --save-dev @babel/core @babel/cli

安装完成以后, 你的 package.json 会加入这些代码

"devDependencies": {
   + "@babel/cli": "^7.12.8",
   + "@babel/core": "^7.12.9"
  }

如今把 Babel 的运行命令放入到 npm 脚本中, 也是在 package.json 中

"scripts": {
+     "build": "babel src -d lib"

  }

建立.babelrc配置文件

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

建立babel.config.json文件,写入如下内容

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

环境都配置完成, 下面开始正式写代码了

写一段ES6代码

建立 /src/index.js

$  mkdir src
$  touch src/index.js

写入一个简单的箭头函数

let sayHello = () => {
    console.log('hello xiaotaideng')
}

sayHello()

如今运行刚刚写好的启动脚本

$ npm run build

完成以后能够看到目录中新增了一个build文件夹,打开里面的index.js它的内容是这样的

"use strict";

var sayHello = function sayHello() {
 console.log('hello xiaotaideng');
};

sayHello();

如今执行下面的命令

$  node build/index.js

能够正常的输出，到如今好像已经能够正常的使用了

原文地址 https://segmentfault.com/a/11...