1

我正在尝试使用 browserify 将我的 Angular js 打包到一个脚本中。require当我在我的主文件中使用它时效果很好app.js，但是当其中一个所需的模块app.js包含它自己require时，依赖项不包含在我的包中。

回顾一下，在app.js（链接到 repo 中的行）：

require("splash-header");
// more code here

splashHeader.js：

require("social-button-directive");
// more code here

socialButtons.js没有依赖项。

browserify --list app.js未按应有的方式列出splashHeader.js，并且通过生成的捆绑包browserify app.js -o bundle.js不包含 socialButton 的 javascript。所以当然，如果我尝试加载网站，我会Uncaught Error: Cannot find module 'social-button-directive'在 splashHeader 的require('social-button-directive').

同样重要的是要注意，我使用 中的“浏览器”选项将模块名称映射到文件位置package.json，并使用 browerify-shim，因为我的模块都不兼容 common-js。

package.json的相关部分：

"dependencies": {
    "browserify": "~9.0.3",
    "browserify-shim": "~3.8.3"
},
"browserify": {
    "transform": [
        "browserify-shim"
    ]
},
"browserify-shim": {
    "splash-header": {
        "depends": "angular",
        "exports": "angular.module('splash-header').name"
    },
    "social-button-directive": {
        "depends": "angular",
        "exports": "angular.module('social-button-directive').name"
    }
},
"browser":{
    "splash-header": "./ng-modules/splashHeader/splashHeader.js",
    "social-button-directive": "./ng-modules/socialButtons/socialButtons.js"
}

我整个早上都在做这个，完全被难住了。我已经削减了有问题的项目，以作为问题的最小示例。要进行测试，只需克隆和 npm 安装。如果您正在查看详细信息，这里是工作/不工作版本 diff。

我已经尝试通过相对路径（require('./ng-modules/socialButtons/socialButtons.js）`）加载子模块，但没有运气。也许我错误地填充了东西？我的方法来自这篇文章。

编辑：这肯定是我的 browserify-shim 配置。将模块转换为 commonjs 并从 package.json 中删除 browserfy-shim 选项后一切正常。我想我只需要把这一切都写出来才能确定。=/

4

0 回答 0