Question

我想在浏览器中使用我的NodeJS模块 - 所以我使用browserify来处理它。

现在，如何阻止browserify在捆绑文件中包含模块的依赖项？在这种情况下，依赖关系为lodash，我将在index.html中单独加载。

这是我到目前为止所得到的：

的index.html

<script src="lodash.js"></script>
<script src="my-module.js"></script>

index.js

var _ = require('lodash');

_.each([0, 1, 2], function(item) {
    console.log(item);
});

gulp.js

var browserify = require('browserify'),
  source = require('vinyl-source-stream');

gulp.task('browserify', function() {
  return browserify()
    .require('./index.js', {
      expose: 'my-module'
    })
    .bundle()
    .pipe(source('my-module.js'))
    .pipe(gulp.dest('./'));
});

Answer 1

browserify-shim提供了设置全局变量的选项。

以下是我对代码所做的更改。

的package.json

{
  "browserify-shim": {
    "lodash": "global:_"
  },
  "browserify": {
    "transform": ["browserify-shim"]
  }
}

gulp.js

gulp.task('browserify', function() {
  return browserify('./index.js')
    .require('./index.js', {
      expose: 'my-module'
    })
    .transform('browserify-shim', {
      global: true
    })
    .bundle()
    .pipe(source('bundle.js'))
    .pipe(gulp.dest('./'));
});

Answer 2

可以选择排除文件：

用法：浏览[输入文件] {OPTIONS}
  [...]
      --ignore，-i用空存根替换文件。文件可以是全文      --exclude，-u从输出包中省略一个文件。文件可以是globs。

https://github.com/substack/node-browserify#usage

以及相应的exclude函数：

b.exclude（文件）

防止文件中的模块名称或文件显示在输出包中。

如果您的代码尝试require（）该文件，它将抛出，除非您提供了另一种加载它的机制。

所以你应该试试这个：

return browserify()
  .require('./index.js', {
    expose: 'my-module'
  })
  .exclude('lodash.js')
  .bundle();

Answer 3

我知道了。

const nodeOnlyModule = eval('require')('module-name');

通过这种方式，您可以欺骗浏览器。

防止browserify包含模块的依赖项

3 个答案: