0

我继承了一个相当不寻常的网站，它混合了 C# 和 Node JS（使用 TypeScript）。我们在 Azure DevOps 上设置了一个持续集成环境来构建网站并将其部署到测试环境。自 3 月以来，我们不必构建网站，现在构建过程突然中断。我们不得不将 package.json 中对“gulp”的引用从“github:gulpjs/gulp#4.0”（不再存在）更改为“github:gulpjs/gulp#71c094a51c7972d26f557899ddecab0210ef3776”，但现在构建过程的步骤是调用 gulp ("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

如果我在本地运行“node node_modules\gulp\bin\gulp.js package”，我会得到以下信息：

[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_modules\gulp\node_modules\gulp-cli\lib\versioned\^4.0.0\format-error.js:20:10)
    at Gulp.<anonymous> (C:\.....\node_modules\gulp\node_modules\gulp-cli\lib\versioned\^4.0.0\log\events.js:31:15)
    at emitOne (events.js:120:20)
    at Gulp.emit (events.js:210:7)
    at Object.error (C:\.....\node_modules\undertaker\lib\helpers\createExtensions.js:61:10)
    at handler (C:\.....\node_modules\now-and-later\lib\mapSeries.js:43:14)
    at f (C:\.....\node_modules\once\once.js:25:25)
    at f (C:\.....\node_modules\once\once.js:25:25)
    at tryCatch (C:\.....\node_modules\async-done\index.js:24:15)
    at done (C:\.....\node_modules\async-done\index.js:40:12)

这个链接 - https://github.com/babel/gulp-babel/issues/154 - 似乎暗示了browserify的问题（​​或者至少是browserify和babel-core之间的不兼容）？唯一的建议是放弃使用 browserify。对我来说神秘的是为什么这以前有效，但现在我们所做的只是对 gulp 的引用而失败了。

谁能向我解释导致错误的原因以及如何解决？任何帮助将不胜感激。

引发错误的 gulp 任务是这样的：

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 = "App/main.ts" config.jsDest = "./wwwroot/js"

gulpfile.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')();

package.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 任务变成：

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));
});

但是当我在本地执行“node node_modules\gulp\bin\gulp.js package”时，我得到了完全相同的错误。

如果您需要更多详细信息或代码，请告诉我。谢谢你提供的所有帮助。

4

1 回答 1

1

我的一个同事解决了这个问题。解决方案当然是使用 babelify。但是，我得到了错误的实现。有效的 gulp 任务中的用法是：

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",
于 2018-12-06T21:36:34.290 回答