我使用browserify和factor-bundle来管理依赖项,理论上它应该运行得很好。我们在页面之间有不同的端点,并且运行因子束拆分非常快速有效地进行缓存。
问题在于我遇到了这个问题:https://github.com/substack/factor-bundle/issues/13
除非有解决方法,否则在问题得到解决之前,这似乎会使因子束完全失效。有没有办法在过渡期间手动拆分常见的依赖项?或者甚至是以减少的容量使用因子束的方法?
修改
这是我目前的gulp构建脚本:
var browserify = require('browserify');
var bromote = require('bromote');
var PassThrough = require('stream').PassThrough;
var gulp = require('gulp');
var streamify = require('gulp-streamify');
var handleErrors = require('../util/handleErrors');
var source = require('vinyl-source-stream');
gulp.task('browserify', function () {
var remote = {
google_maps: {
exports: 'google_maps',
url : '//maps.google.com/maps/api/js?v=3.12&sensor=false&key=xxx&libraries=places&callback=?'
}
};
var sources = {
entries: [
'./a.js',
'./b.js',
'./c.js'
],
bundles: [
'./build/a.js',
'./build/b.js',
'./build/c.js'
]
};
bromote(null, remote, function (err) {
if (err) {
return console.error(err);
}
for (var i = 0; i < sources.entries.length; i++) {
var passThrough = new PassThrough();
browserify({
debug: true,
entries : sources.entries[i],
basedir : './js/'
})
.bundle()
.pipe(passThrough)
.on('error', handleErrors)
.pipe(source(sources.bundles[i]))
.pipe(gulp.dest('./'));
}
return true;
});
});
这是包含factor-bundle的版本:
var browserify = require('browserify');
var bromote = require('bromote');
var PassThrough = require('stream').PassThrough;
var gulp = require('gulp');
var streamify = require('gulp-streamify');
var factor = require('factor-bundle');
var handleErrors = require('../util/handleErrors');
var source = require('vinyl-source-stream');
gulp.task('browserify', function () {
var remote = {
google_maps: {
exports: 'google_maps',
url : '//maps.google.com/maps/api/js?v=3.12&sensor=false&key=xxx&libraries=places&callback=?'
}
};
var sources = {
entries: [
'./a.js',
'./b.js',
'./c.js'
],
bundles: [
'./build/a.js',
'./build/b.js',
'./build/c.js'
]
};
bromote(null, remote, function (err) {
if (err) {
return console.error(err);
} var passThrough = new PassThrough();
return browserify({
entries: sources.entries,
basedir: './js/',
fullPaths : false
})
.plugin(factor, {
o: sources.bundles
})
.bundle({
debug: true
})
.pipe(passThrough)
.on('error', handleErrors)
.pipe(source('common.js'))
.pipe(gulp.dest('./build/'));
});
});