将angularjs库与捆绑的browserify分开

Question

我有一个浏览我的文件的gulp任务。目前它的工作原理是捆绑包括angular.js文件在内的所有内容。我想拉出angular.js并在捆绑的javascript文件之前加载到我的index.html中。

我已经通过将.external（'angular'）添加到browserify调用来完成此操作，但捆绑的结果文件没有变得更小，当我在浏览器中运行应用程序时，它表现得像是在尝试加载节点角度包（错误：未捕获错误：无法找到模块'angular'）

以下是我认为存在问题的gulp任务。

function identity (input) {
  return input;
}

function bundler (watch, mocks) {
  var b = (watch ? watchify : identity)(
      browserify(watch && watchify.args)
      .external('angular')
  );
  b.add(format('./%s', app)).add('babel/polyfill');
  if (mocks) b.add(format('./%s/mock', app));
  return b;
}

function bundle (bundler) {
  return bundler
    .bundle()
    .pipe(source('main.js'))
    .pipe(gulp.dest('dist/app'));
}

gulp.task('bundle', function () {
  var bundled = bundle(bundler())
  if (!production) return bundled;
  return bundled
    .pipe(buffer())
      .pipe(replace(/('|")use strict\1/g, ''))
    .pipe(plugins.uglify())
    .pipe(plugins.rename({
      suffix: '.min'
    }))
    .pipe(gulp.dest('dist/app'));
});