如何使用browserify时包括jQuery的在AngularJS？ [英] How to include jQuery in AngularJS when using browserify?

问题描述

我使用节点，一饮而尽和browserify让我的JS-文件到正确的顺序和管理模块。我有jQuery和AngularJS为节点模块安装，并要求他们在需要的时候。默认情况下角使用jqLit​​e来处理DOM元素。

我知道，当jQuery的AngularJS之前被加载时，将折角，而不是使用jQuery的jqLit​​e

但是，如何可以使用browserify时获得角度使用jQuery。或者：？一个人怎么可能要求了jQuery角

现在我只是在做变量$ =要求（jQuery的）; 并使用它，当我需要它。但我想有一个角度在做例如，当将本机给我jQuery方法：

  app.directive（目录功能（）{
    返回{
        链接：功能（$范围，$ ELEM）{
            风险价值= $ elem.width（）; // jQuery方法目前还没有可在这里
        }
    };
}）;
 

我真正需要做的：

  VAR的jQuery =规定（jQuery的）;app.directive（目录功能（）{
    返回{
        链接：功能（$范围，$ ELEM）{
            VAR jqElement =的jQuery（$ ELEM）;
            风险价值= $ jqElement.width（）; // jQuery方法都可以在这里
        }
    };
}）;
 

解决方案

您可以使用 browserify-垫片

  NPM安装browserify-垫片--save-dev的
 

的package.json

 browserify：{
  改造：browserify-垫片]
}，
浏览器：{
  jQuery的：./node_modules/jquery/dist/jquery.js
}，
browserify-垫片：{
  jQuery的：$
  角度：{
    出口：角，
    决定：jQuery的]
  }
}
 

I'm using node, gulp and browserify to get my JS-Files into the right order and manage modules. I have jQuery and AngularJS installed as node modules and require them when needed. Angular by default uses jqLite to handle DOM-Elements.

I know that when jQuery gets loaded before AngularJS, Angular will use jQuery instead of jqLite.

But how is it possible to get Angular to use jQuery when using browserify. Or: How may one require jQuery to angular?

Now I'm just doing var $ = require("jquery"); and use it when I need it. But I'd like to have an Angular that will natively give me jQuery methods when doing for example:

app.directive("dir", function () {
    return {
        link : function ($scope, $elem) {
            var a = $elem.width();//jQuery methods currently not available here
        }
    };
});

What I actually need to do:

var jQuery = require("jquery");

app.directive("dir", function () {
    return {
        link : function ($scope, $elem) {
            var jqElement = jQuery($elem);
            var a = $jqElement.width();//jQuery methods are available here
        }
    };
});

解决方案

You can use browserify-shim

npm install browserify-shim --save-dev

package.json

"browserify": {
  "transform": ["browserify-shim"]
},
"browser": {
  "jquery": "./node_modules/jquery/dist/jquery.js",
},
"browserify-shim": {
  "jquery": "$",
  "angular": {
    "exports": "angular",
    "depends": ["jquery"]
  }
}

这篇关于如何使用browserify时包括jQuery的在AngularJS？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！