1

我正在尝试使 gulp 文件适应我的目的，但遇到了问题。我只关心一项任务：

    gulp.task('js:browser', function () {
      return mergeStream.apply(null,
        Object.keys(jsBundles).map(function(key) {
          return bundle(jsBundles[key], key);
        })
      );
    });

它使用 browserify 将我的包压缩成一个可用的单个文件。它使用这两种方法和这个对象：

function createBundle(src) {
  //if the source is not an array, make it one
  if (!src.push) {
    src = [src];
  }


  var customOpts = {
    entries: src,
    debug: true
  };
  var opts = assign({}, watchify.args, customOpts);
  var b = watchify(browserify(opts));

  b.transform(babelify.configure({
    stage: 1
  }));

  b.transform(hbsfy);
  b.on('log', plugins.util.log);
  return b;
}

function bundle(b, outputPath) {
  var splitPath = outputPath.split('/');
  var outputFile = splitPath[splitPath.length - 1];
  var outputDir = splitPath.slice(0, -1).join('/');

  console.log(outputFile);
  console.log(plugins);
  return b.bundle()
    // log errors if they happen
    .on('error', plugins.util.log.bind(plugins.util, 'Browserify Error'))
    .pipe(source(outputFile))
    // optional, remove if you don't need to buffer file contents
    .pipe(buffer())
    // optional, remove if you dont want sourcemaps
    .pipe(plugins.sourcemaps.init({loadMaps: true})) // loads map from browserify file
       // Add transformation tasks to the pipeline here.
    .pipe(plugins.sourcemaps.write('./')) // writes .map file
    .pipe(gulp.dest('build/public/' + outputDir));
}

var jsBundles = {
  'js/polyfills/promise.js': createBundle('./public/js/polyfills/promise.js'),
  'js/polyfills/url.js': createBundle('./public/js/polyfills/url.js'),
  'js/settings.js': createBundle('./public/js/settings/index.js'),
  'js/main.js': createBundle('./public/js/main/index.js'),
  'js/remote-executor.js': createBundle('./public/js/remote-executor/index.js'),
  'js/idb-test.js': createBundle('./public/js/idb-test/index.js'),
  'sw.js': createBundle(['./public/js/sw/index.js', './public/js/sw/preroll/index.js'])
};

当我运行 gulp 任务 js:bower 时，我从.pipe(plugins.sourcemaps.init({loadMaps: true}))表达式中得到以下错误：

TypeError: Cannot read property 'init' of undefined

我知道这些行是可选的，我可以将它们注释掉，但我确实想要它们。当我在示例文件中运行代码时，它工作正常，当我在我的 gulp 文件中运行它时，它给了我错误。关于我可能遗漏的任何建议？谢谢！

4

1 回答 1

4

gulp-load-plugins分析package.json文件的内容以找出您安装了哪些 Gulp 插件。确保它gulp-sourcemaps在"devDependencies"此处定义的范围内。如果不运行

npm install --save-dev gulp-sourcemaps

您的问题与延迟加载 sourcemaps 插件有关的可能性很小。如果上述方法无济于事，请尝试gulp-load-plugins这样的要求：

var plugins = require('gulp-load-plugins')({lazy:false});
于 2016-04-22T05:49:37.960 回答