javascript - 怎么让 Browserify 编译时不打包指定文件

Question

问题是这样的，我写了个模块A.js：

if (typeof module === "object" && typeof module.exports === "object") {
   module.exports.demo = 123;
}

我在main.js里引入了A模块

var a = require("A");

此时编译Browserify会将main.js和A.js打包在一起，但我希望编译时不把A.js算在内，而是这样引用：

<script src="A.js"></script>
<script src="browserify编译后的js"></script>

那该如何做呢

Answer 1

browserify -r ./A.js -o static/A.js
browserify main.js -o static/main.js -x ./A.js

-r 即 --require，即表示打包成一个require 文件，-x 即 --external 表示不打包这个文件到static/main.js中，而是从外部文件中加载这个依赖。

HTML 中写:

<script src="static/A.js"></script>
<script src="static/main.js"></script>

Answer 2

var gulp = require("gulp");
var gutil = require("gulp-util");
var source = require('vinyl-source-stream');

var browserify = require("browserify");
var babelify = require("babelify");
var browserifyShim = require("browserify-shim");

gulp.task("mytask",function(){
    return browserify()
        .add('./src/Main.js')
        .transform(babelify)
        .transform(browserifyShim,{
            shim:{
                react:"global:React"
            }
        })
        .bundle()
        .pipe(source('./main.js'))
        .pipe(gulp.dest('./dist/js/'));
});

https://github.com/thlorenz/browserify-shim/pull/195