Gulp任务失败-Browserify/Babel不兼容



我继承了一个非常不寻常的网站,它是C#和NodeJS的混合体(使用TypeScript(。我们在Azure DevOps上建立了一个持续集成环境,用于构建网站并将其部署到测试环境中。自三月份以来,我们就没有构建过这个网站,现在构建过程突然中断了。我们不得不将package.json中对"gump"的引用从"github:gulpjs/gulp#4.0"(已不存在(更改为"github:culpjs/gulp#71c094a51c7972d26f557899ddecab0210ef3776",但现在调用gump的构建过程步骤("node-node_modules\gulp\bin\gulp.js package"(失败,并出现以下错误(这来自DevOps构建日志(:

2018-12-04T22:38:48.9501268Z [22:38:48] TypeError in plugin "gulp-babel"
2018-12-04T22:38:48.9501465Z Message:
2018-12-04T22:38:48.9501806Z     Path must be a string. Received undefined

如果我在本地运行"nodenode_modules\gulp\bin\gulp.js包",我会得到以下内容:

[11:54:45] Error: TypeScript error: node_modules/@angular/router/src/router_module.d.ts(140,41): Error TS1110: Type expected.
at formatError (C:.....node_modulesgulpnode_modulesgulp-clilibversioned^4.0.0format-error.js:20:10)
at Gulp.<anonymous> (C:.....node_modulesgulpnode_modulesgulp-clilibversioned^4.0.0logevents.js:31:15)
at emitOne (events.js:120:20)
at Gulp.emit (events.js:210:7)
at Object.error (C:.....node_modulesundertakerlibhelperscreateExtensions.js:61:10)
at handler (C:.....node_modulesnow-and-laterlibmapSeries.js:43:14)
at f (C:.....node_modulesonceonce.js:25:25)
at f (C:.....node_modulesonceonce.js:25:25)
at tryCatch (C:.....node_modulesasync-doneindex.js:24:15)
at done (C:.....node_modulesasync-doneindex.js:40:12)

此链接-https://github.com/babel/gulp-babel/issues/154-似乎暗示了browserfy的问题(或者至少是browserfy和babel core之间的不兼容(?唯一的建议是停止使用browserfy。对我来说,神秘的是,为什么这在以前有效,但现在失败了,因为我们所改变的只是提到了吞咽。

有人能向我解释一下是什么导致了这个错误以及如何解决吗?任何帮助都将不胜感激。

引发错误的吞咽任务是:

gulp.task("bundle", function () {
return browserify({
basedir: '.',
debug: true,
entries: [config.appMain],
cache: {},
packageCache: {}
})
.plugin(tsify)
.bundle()
.pipe(source('app.bundle.js'))
.pipe(buffer())
.pipe(sourcemaps.init())
.pipe(babel({ presets: ['env'] }))
.pipe(uglify())
.pipe(sourcemaps.write('./', { includeContent: false, sourceRoot: '../' }))
.pipe(gulp.dest(config.jsDest));
});

config.appMain="应用/main.ts"config.jsTest="./wwwroot/js">

gullfile.js顶部的相关"要求"是:

var gulp = require('gulp');
var browserify = require("browserify");
var tsify = require("tsify");
var source = require('vinyl-source-stream');
var buffer = require('vinyl-buffer');
var sourcemaps = require('gulp-sourcemaps');
var babel = require('gulp-babel');
var uglify = require("gulp-uglify");
var config = require('./gulp.config')();

软件包.json的devDependencies版本为:

"@types/core-js": "^0.9.34",
"@types/node": "^6.0.45",
"babel-preset-env": "^1.7.0",
"browserify": "^16.2.3",
"concurrently": "^3.4.0",
"del": "^2.2.2",
"gulp": "github:gulpjs/gulp#71c094a51c7972d26f557899ddecab0210ef3776",
"gulp-babel": "^6.1.2",
"gulp-clean": "^0.3.2",
"gulp-clean-css": "^3.0.4",
"gulp-concat": "^2.6.1",
"gulp-copy": ">=0.0.2",
"gulp-cssmin": "^0.2.0",
"gulp-htmlmin": "^3.0.0",
"gulp-load-plugins": "^1.3.0",
"gulp-rename": ">=1.2.2",
"gulp-rimraf": ">=0.2.0",
"gulp-sourcemaps": "^2.6.0",
"gulp-uglify": "^3.0.0",
"gulp-util": "^3.0.8",
"gulp-watch": ">=4.3.9",
"jasmine-core": "2.4.1",
"merge-stream": "^1.0.1",
"nodemon": "^1.11.0",
"tsify": "^3.0.1",
"tslint": "^3.15.1",
"typescript": "^2.0.0",
"typings": "^1.3.2",
"vinyl-buffer": "^1.0.0",
"vinyl-source-stream": "^2.0.0"

我已经尝试过使用babelify,所以吞咽任务变成了:

gulp.task("bundle", function () {
return browserify({
basedir: '.',
debug: true,
entries: [config.appMain],
cache: {},
packageCache: {}
})
.transform(babelify, { presets: ['env'] })
.plugin(tsify)
.bundle()
.pipe(source('app.bundle.js'))
.pipe(buffer())
.pipe(sourcemaps.init())
.pipe(uglify())
.pipe(sourcemaps.write('./', { includeContent: false, sourceRoot: '../' }))
.pipe(gulp.dest(config.jsDest));
});

但当我在本地执行"nodenode_modules\gulp\bin\gulp.js包"时,我会得到完全相同的错误。

如果您需要更多详细信息或代码,请告诉我。谢谢你能提供的任何帮助。

我的一位同事解决了这个问题。当然,解决方案是使用babelify。然而,我的实现是错误的。在gullow任务中的用法是:

gulp.task("bundle", function () {
return browserify({
transform: [["babelify", { "presets": ["@babel/preset-env"] }]],
basedir: '.',
debug: true,
entries: [config.appMain],
cache: {},
packageCache: {}
})
.plugin(tsify)
.bundle()
.pipe(source('app.bundle.js'))
.pipe(buffer())
.pipe(sourcemaps.init())
.pipe(babel({ presets: ["@babel/preset-env"] }))
.pipe(uglify())
.pipe(sourcemaps.write('./', { includeContent: false, sourceRoot: '../' }))
.pipe(gulp.dest(config.jsDest));
});

package.json devDependencies中使用的包和版本为:

"browserify": "^16.2.3",
"@babel/core": "^7.2.0",
"@babel/preset-env": "^7.2.0",
"babelify": "^10.0.0",
"gulp-babel": "8.0.0",

最新更新