Question

我正在尝试使用gulp从供应商处拆分源代码。在当前状态下，这就是我的gulpfile.js的设置方式：

gulpfile.js

/////////////       LIBS        \\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\

var gulp = require('gulp');
var browserSync = require('browser-sync').create();
var superstatic = require('superstatic');
var gulpTsc = require('gulp-typescript');
var sourcemaps = require('gulp-sourcemaps');
var tsConfigGlob = require('tsconfig-glob');
var browserify = require('browserify');
var path = require('path');
var child_process = require('child_process');
var del = require('del');
var sourceStream = require('vinyl-source-stream');

// other tasks

var bundleVendorFiles = function(done) {
var deps = Object.keys(ngPkgFile && ngPkgFile.dependencies || {});
deps.map(d => {
    let posOfAt = d.indexOf('@'),
        modName = `${angularAppLocation}/node_modules/`,
        exposeName = d;
    if(posOfAt < 0) modName += d;
    else modName += `@angular/${d.split('/').pop()}`;
    return {
        file: modName,
        expose: exposeName
    };    
});
browserify({
    paths: [angularAppLocation+'/node_modules'],
    basedir: '/home/zerocool/srs-demo/loginapp'
})
    .require(deps)
    .transform("babelify", { presets: ["es2015"]})
    .bundle()
    .pipe(sourceStream('vendor.bundle.js'))
    .pipe(gulp.dest(angularAppLocation+'/dist'));
done();
};

gulp.task('default', gulp.series([
'clean-dist-dir', 'copy-index-file', 'expand-file-glob',
'ts-compile', 'bundle-vendor-pkgs',/*
'copy-static-assets', 'copy-misc-asset-files'*/
]));

我已经测试了所有其他任务，它们都正常工作。当我使用此文件运行gulp时，我在console

处获得以下输出

[02:31:16] Using gulpfile ~/srs-demo/gulpfile.js
[02:31:16] Starting 'default'...
[02:31:16] Starting 'clean-dist-dir'...
[02:31:16] Finished 'clean-dist-dir' after 9.41 ms
[02:31:16] Starting 'copy-index-file'...
[02:31:16] Finished 'copy-index-file' after 13 ms
[02:31:16] Starting 'expand-file-glob'...
[02:31:16] Finished 'expand-file-glob' after 38 ms
[02:31:16] Starting 'ts-compile'...
[02:31:16] Finished 'ts-compile' after 407 ms
[02:31:16] Starting 'bundle-vendor-pkgs'...
[02:31:16] Finished 'bundle-vendor-pkgs' after 29 ms
[02:31:16] Finished 'default' after 501 ms

events.js:112
  throw er; // Unhandled 'error' event
  ^
SyntaxError: 'import' and 'export' may appear only with 'sourceType: module'

此gulpfile中我缺少什么？除了gulpfile之外，是否还需要其他任何设置吗？我是gulp的新手，因此，如果需要更多信息，请询问。谢谢

Answer 1

这意味着babelify无法正确地转译您的js。

尝试

browserify({
    paths: [angularAppLocation+'/node_modules'],
    basedir: '/home/zerocool/srs-demo/loginapp'
})
    .require(deps)
    .transform(babelify.configure({presets: ["@babel/preset-env"]}))
    .bundle()
    .pipe(sourceStream('vendor.bundle.js'))
    .pipe(gulp.dest(angularAppLocation+'/dist'));
done();
};

请确保通过npm i --save-dev @babel/core @babel/preset-env下载这些程序包依赖项

使用Gulp捆绑供应商文件

1 个答案: