使用gulp ES6转ES5-CFANZ编程社区

1.github地址：https://github.com/xutongbao/gulp-es6

克隆下来后DOS环境跳转到gulp-es6文件夹，然后运行：npm install安装插件

然后运行gulp，就可以将ES6代码转成ES5

使用gulp ES6转ES5_javascript

3.index.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>使用gulp ES6转ES5</title>
</head>
<body>
    <script src="People.js"></script>
</body>
</html>

4.People.js

class People {
  constructor(name) {
    this.name = name;
  }
  getName() {
    return this.name;
  }
}
let people = new People('徐同保');
console.log(people.getName());

5..babelrc

{
  "presets": [
    "es2015"
  ],
  "plugins": []
}

6.gulpfile.js

var gulp = require("gulp");
var babel = require("gulp-babel");

gulp.task("default", function () {
    return gulp.src("src/*.js")
        .pipe(babel())
        .pipe(gulp.dest("dist"));
});

7.package.json

{
  "name": "demo2",
  "version": "1.0.0",
  "main": "index.js",
  "devDependencies": {
    "babel-core": "^6.26.0",
    "babel-preset-es2015": "^6.24.1",
    "gulp": "^3.9.1",
    "gulp-babel": "^7.0.0"
  },
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "author": "",
  "license": "ISC",
  "description": ""
}

8.dist/People.js

'use strict';

var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();

function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }

var People = function () {
  function People(name) {
    _classCallCheck(this, People);

    this.name = name;
  }

  _createClass(People, [{
    key: 'getName',
    value: function getName() {
      return this.name;
    }
  }]);

  return People;
}();

var people = new People('徐同保');
console.log(people.getName());