Question

首先，我在angular中有angular-bootstrap，jquery和package.json，所有内容都是通过browserify汇编的。

// package
"dependencies": {
    "angular": "~1.4.6",
    "angular-bootstrap": "~0.12.2",
    "jquery": "~2.1.4"
}

NPM中

angular-bootstrap没有任何高于0.12.2的值，所以我将ng-bootstrap切换到bower.json

// bower
"dependencies": {
    "angular-bootstrap": "~0.13.4"
}

在我的package.json

中添加了别名

// package
"browser": {
    "angular-bootstrap": "./bower_components/angular-bootstrap/ui-bootstrap.js",
    "angular-bootstrap-tpls": "./bower_components/angular-bootstrap/ui-bootstrap-tpls.js"
}

完成所有这些操作后，jQuery仍可在全局命名空间中使用（可在浏览器控制台中访问），但angular指令似乎不再选择使用jQuery。

在我的directive中，如果我退出element或查看其原型（element.__proto__），我只会看到可用的基本jqLite方法，而不是完整的jQuery 1}}在我切换到凉亭之前可以使用（我在控制台中查看jQuery时看到）。

// directive
.directive('myDirective', function() {
    return function(scope, element, attrs) {
        console.log(element);
        console.log(Object.getPrototypeOf(element)); // <-- No jQuery methods available, only jqLite
    }; 
});

我尝试了几种不同的方式来填补依赖关系，但我认为这是必要的，因为jQuery是通过package而不是bower加载的。

// package
"browserify-shim": {
    "angular-bootstrap": {
        "depends": "jquery:jQuery"
    }
}

任何帮助都会受到赞赏 - 不知道我在这里失踪了什么。

Answer 1

这就是我所拥有的，jQuery在jqlite之上得到了正确的解决：

bower.json

  "dependencies": {
    "jquery": "2.1.4"
},
  "resolutions": {
    "jquery": "2.1.4"
}

package.json

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

 "browser": {
     "jquery": "./bower_repo/jquery/dist/jquery.js"
  },
  "browserify-shim": {
    "jquery": "$"
  }

Angular在从package.json移动到bower.json之后无法识别jQuery

1 个答案: