如何使用browserify绑定多个javascript库？

我试图在浏览器中使用BrowerFiy，如果我使用standalone选项，它将公开一个模块。我不想这样做。 在我实际编译代码之后，网站和文档似乎被切断了。 没有人说过如何在browser属性中实际使用代码

我有一项艰巨的任务：

browserify: {
      standalone: {
        src: [ '<%= yeoman.server %>/shared-components/**/*.js' ],
        dest: '<%= yeoman.client %>/app/js/browserifed-shared-code.js',
        /* Commented out, zero documentation on this. Can only expose one module it seems.
        options: {
          browserifyOptions: {
            standalone: 'Utility' //Unable to say '**/*' error :-/
          }
        }
        */
      },

但我明白了

Uncaught ReferenceError: require is not defined(…)

---

我不知道/无法在浏览器中加载这些模块。：'-/

这里有两种选择。要么你

解决方案1 为要在浏览器中访问的每个库创建独立的browserify模块。这已经在你的另一篇文章中得到了回答。基本上，您可以执行多个browserify包

然后，使用browserify

browserify main.js --standalone Library -o bundle.js

然后在浏览器中

<script src="bundle.js" type="text/javascript"/> 

然后迭代将它们添加到grunt配置中(

---

查看这篇文章，动态创建它们

我以自己的方式实现了这一点，没有过多地混淆项目的依赖性

在咕噜声中我有

browserify: {
      standalone: {
        src: [ '<%= yeoman.server %>/shared-components/exposed-modules.js' ],
        dest: '<%= yeoman.client %>/app/js/browserifed-shared-code.js',
        options: {
          browserifyOptions: {
              standalone: 'Shared'
          }
        }
      },
    }

//In-completed example.
watch: {
      scripts: {
        files: ['<%= yeoman.server %>/shared-components/**/*.js'],
        tasks: ['browserify'],
        options: {
            spawn: false
        }
        },

在浏览器中，我现在可以调用

shared.Utility.isAscii('test'); //Working.

我想重用的任何地方，我只是在范围内分配，所以

//Some scope.
var Utility = shared.Utility;

---

如果添加了新的类，那么它们可以动态添加，我可以不使用foreach吗？非常感谢。我将发布我所拥有的。我使用共享的公共端点动态访问其他类。我查看了CommonJS，但是faaaar有太多文档，我没有时间+我认为这是额外的复杂问题，我不需要。CommonJS是一个带有依赖项注入的模块加载器。基本上，您可以声明模块及其依赖项，并且它们是异步解析的，因此它更适合于浏览器（更快的响应）.但是如果你有一点脚本，那没关系。另外，我认为你使用的是Angular，所以请坚持使用Angular样式模块和ocLazyLoader，这会让你的生活更轻松。我查看了这些，但它们有一页又一页的文档。见我的答案。是的，小脚本：-）我接受了你的答案，因为它让我完成了我的答案。我被你想做的事情弄糊涂了。Browserify捆绑您的代码以实现高效的客户端交付，并且可以公开单个全局（通过

独立

选项），您可以通过该选项访问内部。它不会将客户机转换为NodeJ，因此它不会给您提供

require

，您只需获得一个库，该库要么匿名加载，要么使用单个全局访问变量，命名为按

standalone

。然后你就不需要“需要”你浏览的东西了，你只需要使用

实用工具
来使用
实用工具。你公开的
是什么属性，
实用工具。你公开的是什么函数你公开的（）
，等等。
你只需要得到一个匿名加载的库
注意解释一下，我匿名加载它并如何访问它？（下面我回答了我自己的问题，因为我仍然找不到对此的解释）如果它以匿名方式加载，您以后不会“访问它”，您编写的代码应该已经能够完成它需要完成的所有操作。如果以后需要访问它，可以使用
--standalone
标志编译，然后确保入口点代码公开所有需要访问的内容。
// ---- main.js -----
module.exports.Library1 = require('./lib1');
module.exports.Library2 = require('./lib2');
module.exports.Library3 = require('./lib3');

browserify main.js --standalone Library -o bundle.js

<script src="bundle.js" type="text/javascript"/> 

browserify: {
      standalone: {
        src: [ '<%= yeoman.server %>/shared-components/main.js' ],
        dest: '<%= yeoman.client %>/app/js/main-bundled.js',
        bundleOptions : { standalone : 'Library' }
      }}

bundledLibraries : [
    Library1 : {
        src : './../src/lib1.js',
        dest : './../src/lib1-bundled.js'
    },
    Library2 ...
]

browserify: {
      standalone: {
        src: [ '<%= yeoman.server %>/shared-components/exposed-modules.js' ],
        dest: '<%= yeoman.client %>/app/js/browserifed-shared-code.js',
        options: {
          browserifyOptions: {
              standalone: 'Shared'
          }
        }
      },
    }

//In-completed example.
watch: {
      scripts: {
        files: ['<%= yeoman.server %>/shared-components/**/*.js'],
        tasks: ['browserify'],
        options: {
            spawn: false
        }
        },

'use strict';

//This is the main entry point for all shared libraries.

var Utility = require('./utility');
var UrlController = require('./url-controller');

var Shared = function(){};

//Added new client modules to be exposed here.
Shared.Utility = Utility;
Shared.UrlController = UrlController;

module.exports = Shared;

shared.Utility.isAscii('test'); //Working.

//Some scope.
var Utility = shared.Utility;