1

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

这似乎是github/babel/gulp-babel上的一个开放问题。

但是，我能够使用 browserify 很好地工作请参考我制作的示例

但我正在尝试使用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
4

2 回答 2

1

事实证明，这是意料之中的。Babel 只会将 ES6 及更高版本转换为 ES5。

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

这是一个例子

于 2019-03-13T21:56:48.623 回答
0

请检查你的 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

于 2019-03-13T05:32:19.067 回答