16

我正在使用browserify来捆绑前端代码。到目前为止一切都很好，但是我在混合 npm 和非 npm 包时遇到了困难。例如，使用 npm 版本的 jQuery 和非 CJS 版本的 jQuery 插件。

我目前的解决方案是使用browserkey inpackage.json指向 jQuery 的 dist，然后使用browserify-shim将其添加为插件的依赖项。

有比我目前拥有的更清洁的方法吗？

编辑：我目前正在尝试使用 npm 并package.json管理我的所有依赖项，所以我不想在这个项目上使用 bower。叫我疯了:)

包.json

{
  "dependencies": {
    "jquery": "~2.1.0",
    "browserify": "latest",
    "browserify-shim": "^3.5.0",
    "jquery-waypoints": "git@github.com:imakewebthings/jquery-waypoints.git",
    "jquery-validation": "git://github.com/jzaefferer/jquery-validation"
  },
  "browser": {
    "jquery": "./node_modules/jquery/dist/jquery.js",
    "jquery-waypoints": "./node_modules/jquery-waypoints/waypoints.js",
    "jquery-validate": "./node_modules/jquery-validation/build/release.js"
  },
  "browserify-shim": {
    "jquery": "$",
    "jquery-waypoints": {
      "depends": [
        "jquery"
      ]
    },
    "jquery-validate": {
      "depends": [
        "jquery"
      ]
    }
  },
  "browserify": {
    "transform": [
      "browserify-shim"
    ]
  }
}
4

3 回答 3

1

我会这样做：

  1. 使用debowerify包括 bower 中可用的库，在您的情况下，将是 jquery-waypoints、jquery-validation

  2. 使用 npm 包中的 jquery，可在此处获取https://github.com/jquery/jquery

因此，我也会暂时删除 browserify-shim。

于 2014-06-13T13:03:36.320 回答
1

该browser指令只是一个别名，用于指定您在编写时想要什么jquery。默认为中的jquery路径node_modules，因此您的行：

"jquery": "./node_modules/jquery/dist/jquery.js",

...是多余的，您可以将其删除，因为当您"depends": ["jquery"]在 Browserify Shim 配置中写入时，jquery已经指向您的密钥中./node_modules/jquery/dist/jquery.js没有该行。browser实际上，您可能browser完全删除该指令，您必须检查这些 jQuery 插件package.json文件中的配置，但很可能它们已经像您拥有它们一样被别名，没有browser覆盖。

否则，我认为没有更清洁的方法来实现这一点。就像您说的那样，您需要使用 Browserify Shim 来填充那些非 CJS jQuery 插件，并且您正在以正确的方式进行操作。

于 2016-03-28T18:51:22.213 回答
0

我认为您缺少正确定义依赖项（例如，将“$”设置为您的 jquery 声明）：

"plugin": {
  "exports": "plugin",
  "depends": [
    "jquery:$"
  ]
},...
于 2015-06-01T19:59:02.773 回答