gulp-babel从> = ES6转换为ES5

Question

我一直无法使用gulp-babel将ES6转换为ES5。

这似乎是github/babel/gulp-babel的一个悬而未决的问题。

但是，我能够使用browserify Refer a sample I made使其运行良好

但我正在尝试使用gulp-babel包

我有以下设置。这是我一直在使用的，但我仍然得到一个缩小的文件，其中包含所有require线。

gulpfile.js

const gulp = require("gulp");
const babel = require("gulp-babel");
const sourcemaps = require("gulp-sourcemaps");
const uglify = require("gulp-uglify-es").default;
const concat = require("gulp-concat");

gulp.task("buildjs", () => {
  return gulp.src(paths.js.source)
    .pipe(sourcemaps.init({ loadMaps: true }))
    .pipe(concat(paths.build.destMinJSFileName))
    .pipe(babel())
    .pipe(uglify())
    .pipe(sourcemaps.write(paths.build.destMapFolder))
    .pipe(gulp.dest(paths.build.destBuildFolder));
});

---

.babelrc

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

---

package.json

"@babel/core": "^7.3.4",
"@babel/polyfill": "^7.2.5",
"gulp": "^4.0.0",
"gulp-concat": "^2.5.2",
"gulp-sourcemaps": "^1.5.2",
"gulp-uglify-es": "^1.0.4"

---

entry.js（paths.js.source）

require("@babel/polyfill");
require("./main")

---

bundle.min.js（实际输出）

"use strict";require("@babel/polyfill"),require("./main")
//# sourceMappingURL=maps/bundle.min.js.map

Answer 1

请检查你的babel和gulp-babel版本。

如果您使用的是babel版本6，则需要明确安装/使用gulp-babel版本7。

如果你使用的是babel版本7，你需要gulp-babel版本8，你现在可以获得npm run i --save-dev gulp-babel。

https://www.npmjs.com/package/gulp-babel

巴别7： npm install --save-dev gulp-babel @babel/core @babel/preset-env

巴别6： npm install --save-dev gulp-babel@7 babel-core babel-preset-env

Answer 2

事实证明，这是预期的。 Babel只会将ES6及以上版本转换为ES5。

需要使用类似browserify或webpack的模块才能使require模块正常工作。

Here就是一个例子