javascript 使用 Browserify 编译动态需要的模块

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/21642398/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-10-27 21:23:50  来源:igfitidea点击:

Compiling dynamically required modules with Browserify

javascriptnode.jsbrowserify

提问by Brad

I am using Browserify to compile a large Node.js application into a single file (using options --bareand --ignore-missing[to avoid troubles with lib-covin Express]). I have some code to dynamically load modules based on what is available in a directory:

我正在使用 Browserify 将大型 Node.js 应用程序编译成单个文件(使用选项--bare--ignore-missing[避免lib-cov在 Express 中出现问题])。我有一些代码可以根据目录中的可用内容动态加载模块:

var fs = require('fs'),
    path = require('path');

fs.readdirSync(__dirname).forEach(function (file) {
    if (file !== 'index.js' && fs.statSync(path.join(__dirname, file)).isFile()) {
        module.exports[file.substring(0, file.length-3)] = require(path.join(__dirname, file));
    }
});

I'm getting strange errors in my application where aribtrary text files are being loaded from the directory my compiled file is loaded in. I think it's because paths are no longer set correctly, and because Browserify won't be able to require()the correct files that are dynamically loaded like this.

我在我的应用程序中遇到奇怪的错误,其中从我的编译文件加载的目录加载了任意文本文件。我认为这是因为路径设置不再正确,并且因为 Browserify 将无法require()正确的文件像这样动态加载。

Short of making a static index.jsfile, is there a preferred method of dynamically requiring a directory of modules that is out-of-the-box compatible with Browserify?

index.js除了制作静态文件之外,是否有一种首选方法可以动态要求与 Browserify 开箱即用的模块目录?

回答by mjlescano

This plugin allows to require Glob patterns: require-globify

这个插件允许 require Glob 模式:require-globify

Then, with a little hack you can add all the files on compilation and not executing them:

然后,通过一些小技巧,您可以在编译时添加所有文件而不执行它们:

// Hack to compile Glob files. Don′t call this function!
function ?_?()?{
  require('views/**/*.js', { glob: true })
}

And, for example, you could require and execute a specific file when you need it :D

并且,例如,您可以在需要时要求并执行特定文件:D

var homePage = require('views/'+currentView)

回答by Miroslav Bajto?

Browserify does not support dynamic requires - see GH issue 377.

Browserify 不支持动态要求 - 请参阅GH 问题 377

The only method for dynamically requiring a directory I am aware of: a build step to list the directory files and write the "static" index.js file.

我所知道的动态需要目录的唯一方法:列出目录文件并编写“静态”index.js 文件的构建步骤。

回答by Christopher Davies

There's also the bulkifytransform, as documented here:

还有bulkify转换,如此处所述:

https://github.com/chrisdavies/tech-thoughts/blob/master/browserify-include-directory.md

https://github.com/chrisdavies/tech-thoughts/blob/master/browserify-include-directory.md

Basically, you can do this in your app.jsor whatever:

基本上,您可以在您的app.js或其他任何内容中执行此操作:

var bulk = require('bulk-require');

// Require all of the scripts in the controllers directory
bulk(__dirname, ['controllers/**/*.js']);

And my gulpfile has something like this in it:

我的 gulpfile 中有这样的内容:

gulp.task('js', function () {
  return gulp.src('./src/js/init.js')
    .pipe(browserify({
      transform: ['bulkify']
    }))
    .pipe(rename('app.js'))
    .pipe(uglify())
    .pipe(gulp.dest('./dest/js'));
});