gulp-babel从> = ES6到ES5的转译

时间:2019-03-06 19:32:36

标签: babel gulp-babel

我无法使用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

1 个答案:

答案 0 :(得分:0)

事实证明,这是预期的。 Babel只会将ES6及更高版本移植到ES5。

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

Here是一个例子