【问题标题】:browserify + browserify-shim angular globalbrowserify + browserify-shim 角度全局
【发布时间】:2024-08-04 06:15:02
【问题描述】:

我通过索引页面上的脚本标签包含来自 google cdn 的 angular js。

我的 package.json 中有以下内容:

"browserify": {
    "transform": [
        "browserify-shim"
    ]
  },
  "browserify-shim": {
      "angular": "global:angular",
      "systemjs": "global:System",
      "jquery": "global:$"
  },

我也在使用带有多个输出包的 grunt-browserify:

app: {
    src: "./src/main.js",
    dest: "./src/bundles/app.bundle.js"
},
login: {
    src: "./src/login/login.module.js",
    dest: "./src/bundles/login.bundle.js"
},
signup: {
    src: "./src/signup/signup.module.js",
    dest: "./src/bundles/signup.bundle.js"
},
main: {
    src: "./src/main/main.module.js",
    dest: "./src/bundles/main.bundle.js"
},

我遇到的问题是,尽管 browserify-shim 被配置为使用 global:angular,但我的一个输出文件中包含了 angular 源。

我正在使用以下模块:

"browserify": "^13.0.0",
"browserify-shim": "^3.8.12",
"grunt-browserify": "^4.0.1",

【问题讨论】:

  • 问题不在于您的 browserifybrowserify-shim 配置,至少如上所示 - 应该可以正常工作。您的 grunt-browserify 设置可能有问题。解决这些问题的最佳方法是创建一个像 this one 这样的 repo,并将您的特定配置添加到一个非常简单的 grunt 版本中,该版本仅包含必要的组件。那么这个错误应该很容易找到。

标签: browserify browserify-shim grunt-browserify


【解决方案1】:

您需要配置外部选项

app: {
  options: {
    external: [
      './src/login/login.module.js',
      './src/signup/signup.module.js',
      './src/main/main.module.js'
    ]
  }
}

【讨论】: