允许使用grunt browserify进行全局转换 [英] Allow global transforms with grunt browserify

问题描述

我在我的html文件中添加了jQuery作为脚本标记，并将其添加到 package.json ，以便使用 browserify-shim 如下：

I've added jQuery as a script tag in my html file and have added it to package.json for working with browserify-shim as follows:

  "browserify": {
    "transform": [
      "browserify-shim"
    ]
  },
  "browserify-shim": {
    "jquery": "global:jQuery"
  },

我可以在主脚本文件中用简单的 require（' jquery'）调用。

I'm able to expose it in my main script file with a simple require('jquery') call.

问题是我正在使用一些内部执行 require的jQuery插件（ 'jquery'）并且由于browserify转换不适用于依赖项的依赖性，因此它导致browserify抱怨捆绑，因为它无法找到 jQuery 。

The problem is that I'm using some jQuery plugins which internally do a require('jquery') and since browserify transforms don't apply to dependency of dependencies, it's causing browserify to complain with bundling since it cannot find jQuery.

现在我知道我可以通过应用全局变换来解决它，因为我无法轻易找到方法。

Now I know that I can solve it by applying global-transforms by I cannot find a way to do it easily.

Browserify文档说你不能在包文件中应用全局变换o以下不起作用（我认为会这样）：

Browserify docs say that you cannot apply global-transforms in package file so the following don't work, (which I thought would):

  "browserify": {
    "global-transform": [
      "browserify-shim"
    ]
  },

  "browserify": {
    "transform": [
      "browserify-shim"
    ],
    "global": true
  },

我也尝试将选项添加到我的 Gruntfile.js ，如下所示，但即使这样也不起作用：

I also tried adding the option to my Gruntfile.js as follows, but even that doesn't work:

browserify: {
        options: {
            global: true
        },
        dist: {
            files: {
                'js/bundle.js': 'js/script.js'
            }
        },
    },

最后一个选项是手动将 browserify-shim 添加到每个依赖项的 package.json ，但我不想这样做，因为这意味着每次添加新插件时，我都必须重复相同的过程。

The last option is to manually add a browserify-shim to every dependency's package.json, but I don't want to do it, since it means every time I add a new plugin, I would have to repeat the same process.

An想要缓解上述问题吗？

Any ideas to mitigate the above problem?

推荐答案

您应该能够通过使用哈希选项提供变换来应用全局变换：

You should be able to apply global-transforms by providing transform with a hash option:

 "browserify": {
   "transform": [
     ["browserify-shim", {global: true}]
   ]
 }

这篇关于允许使用grunt browserify进行全局转换的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！