Bower或Grunt一直在从index.html中删除jQuery。

Question

Bower或Grunt一直在从index.html中删除jQuery。

jquerygruntjsbower

15

这真让我抓狂。到目前为止，通过Yeoman使用Bower+Grunt一直是我沮丧和浪费时间的主要原因。我只想让我的应用程序使用最新的（2.1.0）版本jquery。

bower list正确地报告了jquery 2.1.0作为官方更新。

我运行了bower install --save jquery来更新到最新版本，它也确实完成了。

bower list命令现在正确地报告jquery#2.1.0作为依赖项，并且 bower.json文件现在正确地将jquery与所需版本列为依赖项：

{
  "name": "xxx",
  "version": "0.0.0",
  "dependencies": {
    ...
    "angular": "1.2.13",
    "jquery": "~2.1.0",
    "sizzle": "1.10.16",
    "bootstrap": "~3.0.3",
    ...

但每次我运行grunt build或grunt serve时，<script src="bower_components/jquery/dist/jquery.js"></script>列表都会从index.html中删除，导致整个应用程序无法正常工作。

#> grunt serve
Running "serve" task

Running "clean:server" (clean) task
Cleaning .tmp...OK

Running "bower-install:app" (bower-install) task

jquery was not injected in your file.
Please go take a look in "app/bower_components/jquery" for the file you need, then manually include it in your file.

Running "concurrent:server" (concurrent) task
...

手动添加并不能解决任何问题。我完全被卡住了。我一定做错了什么，但是我已经砸了很长时间，却完全没有效果。谢谢。

- sebnukem

4个回答

16

这里有一个更好的解决方案，不需要强制将脚本标签移开其他 bower 组件。您可以使用一个 overrides 部分（在https://github.com/ajaxorg/ace-builds/issues/20中找到）

将以下部分添加到您项目的 bower.json 文件中：

...
"overrides": {
    "jquery": {
        "main": "dist/jquery.js"
    }
}

- Mike Griffith

这并没有帮助我解决ngcordova的问题 - 我有bower.json文件：{ .. "overrides": { "bootstrap": { "main": [ "less/bootstrap.less", "dist/css/bootstrap.css", "dist/js/bootstrap.js" ] }, "ngCordova": { "main": [ "dist/js/ng-cordova.js" ] } } } - Smitha

1

我几分钟前也遇到了grunt+yeoman+bower的同样问题。在我的情况下，“overrides”解决方案没有起作用。

grunt wiredep

我不断地在app/index.html中重新排列条目。问题最终是出现在bower.json的依赖项部分中jquery的位置上。在我的情况下，jquery是bower.json中依赖项部分的第9个条目。

grunt wiredep

会移动。

<script src="bower_components/jquery/dist/jquery.js"></script>

即使我手动将其设置为#1条目或使用覆盖，也要跳转到应用程序/index.html中的位置＃9。

在我的情况下，jquery需要在angular之前，这种重新排序会在运行时破坏我的应用程序。

我的bower.json中的依赖项部分在之前是这样的：

"dependencies": {
    "angular": "1.4.8",
    "angular-animate": "^1.3.0",
    "angular-aria": "^1.3.0",
    "angular-cookies": "^1.3.0",
    "angular-messages": "^1.3.0",
    "angular-resource": "^1.3.0",
    "angular-route": "^1.3.0",
    "angular-sanitize": "^1.3.0",
    "jquery": "^2.2.3",
},

现在，它看起来像这样（请注意，jQuery已经重新定位到位置＃1）。

"dependencies": {
    "jquery": "^2.2.3",
    "angular": "1.4.8",
    "angular-animate": "^1.3.0",
    "angular-aria": "^1.3.0",
    "angular-cookies": "^1.3.0",
    "angular-messages": "^1.3.0",
    "angular-resource": "^1.3.0",
    "angular-route": "^1.3.0",
    "angular-sanitize": "^1.3.0",
}

我将此放在这里，以便其他人可以使用此解决方案，如果其他方法都无效。

- Guido

你使用的grunt版本是什么？我使用grunt 3.10.5也遇到了同样的问题，但是3.10.3似乎没有这个问题。 - Remi Sture

0

简单而正确的解决方案是在 bower.json 的 overrides 部分中添加此引用：就像我为 jquery-ui 添加的那样。

"overrides": {
    "bootstrap": {
      "main": [
        "less/bootstrap.less",
        "dist/css/bootstrap.css",
        "dist/js/bootstrap.js"
      ]
    },
    "jquery-ui": {
      "main": [
        "themes/base/jquery-ui.css",
        "ui/jquery-ui.js"
      ]
    }
  }

祝福你成功 :)

- nams

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- Stephen · Accepted Answer

这里有一个长答案，但我只有时间回答短的，我想我不妨给你一个简短的回答，而不是什么都没有！

bower-install 是一项任务，它依赖于Bower软件包在其bower.json中正确指定 main 属性。最近jQuery Bower包发生了一些变化，它不再指定这个属性了。没有这个属性，grunt-bower-install 就无法提供太多帮助。

解决办法是在HTML中手动包含对jQuery的引用，将其放在  代码块之外。

很抱歉让您感到沮丧。希望 jQuery 很快能修复它的 bower.json。