Browserify，是否可以将常用模块捆绑到单独的文件中？

Question

我在我的网络应用程序中使用 Browserify + Babel + Gulp。当我捆绑脚本时，我只是将所有内容捆绑到一个文件中。当我检查文件大小时，它有超过 3MB，我认为它太大了。

我不知道 Babel 和 Browserify 是如何改变我的源代码的，但是如果可能的话，我想分离公共模块（比如通过 NPM 安装），所以如果这是一个好方法，让浏览器单独加载文件。

将单个 JS 文件分离为多个小脚本是一种好方法吗？还有没有办法用 Browserify + Babel + Gulp 做到这一点？

这是我使用捆绑脚本时的 gulp 任务：

gulp.task('script', () => {
    return browserify({
        entries: [`${SRC_PATH}/js/app.js`],
        paths: ['./node_modules', './src/js']
    })
    .transform(babelify, { 
        presets: ["es2015", "react", "stage-0"],
        plugins: [
            "transform-runtime",
            "transform-decorators-legacy",
            "transform-async-to-generator"
        ]
    })
    .transform(browserifyCss, { global: true })
    .bundle()
    .pipe(source('app.js'))
    .pipe(buffer())
    .pipe(sourcemaps.init({loadMaps: true}))
    .pipe(sourcemaps.write('./'))
    .pipe(gulp.dest(`${BUILD_PATH}/js`));
});

Answer 1

我通过创建另一个任务来单独构建公共模块来解决这个问题。