Grunt wiredep没有注入字体 - 真棒

时间:2015-08-31 09:29:15

标签: javascript bower font-awesome grunt-wiredep

我目前正在使用yeoman开始的项目。

出于某种原因,当我运行grunt-wiredep时,除了index.html之外,我的font-awesome中的所有依赖项都是相关的。

这是我的bower.json文件:

{
  "name": "watermelon",
  "version": "0.0.0",
  "dependencies": {
    "angular": "^1.3.0",
    "angular-animate": "^1.3.0",
    "angular-bootstrap": "~0.13.3",
    "angular-cookies": "^1.3.0",
    "angular-google-maps-native": "~2.0.0",
    "angular-mocks": "~1.3.0",
    "angular-resource": "^1.3.0",
    "angular-route": "^1.3.0",
    "angular-sanitize": "^1.3.0",
    "angular-scenario": "~1.3.0",
    "angular-touch": "^1.3.0",
    "angular-ui-router": "~0.2.15",
    "bootstrap": "^3.2.0",
    "bootstrap-switch": "~3.3.2",
    "eonasdan-bootstrap-datetimepicker": "~4.15.35",
    "es5-shim": "^4.0.0",
    "font-awesome": "~4.4.0",
    "json3": "^3.3.0",
    "moment": "~2.10.6",
    "ng-tags-input": "3.0.0",
    "requirejs": "latest",
    "requirejs-domready": "latest",
    "stacktrace-js": "~0.6.4",
    "underscore": "~1.8.3"
  },
  "appPath": "."
}

指向Gruntfile.jshttp://pastebin.com/xxZwAYRW

的链接

当我运行grunt-wiredep时,只会注入这些css依赖项:

<!-- bower:css -->
<link rel="stylesheet" href="bower_components/bootstrap/dist/css/bootstrap.css" />
<link rel="stylesheet" href="bower_components/bootstrap-switch/dist/css/bootstrap3/bootstrap-switch.css" />
<link rel="stylesheet" href="bower_components/eonasdan-bootstrap-datetimepicker/build/css/bootstrap-datetimepicker.min.css" />
<link rel="stylesheet" href="bower_components/ng-tags-input/ng-tags-input.min.css" />
<!-- endbower -->

4 个答案:

答案 0 :(得分:19)

latest(4.4.0) commit to FontAwesome已解决了这个问题。

修复非常简单。您需要设置覆盖(或者可以使用更少,但我不打算覆盖它)。

{
  "name": "myProject",
  "version": "0.0.0",
  "dependencies": {
    "font-awesome": ">=4.4.0",
  },  
  "overrides":{
    "font-awesome": {
    "main": [
        "css/font-awesome.css"
    ]
    }
  }
}

OR (因为fontawesome / font-awesome注册了两个名字)

{
  "name": "myProject",
  "version": "0.0.0",
  "dependencies": {
    "fontawesome": ">=4.4.0",
  },  
  "overrides":{
    "fontawesome": {
    "main": [
        "css/font-awesome.css"
    ]
    }
  }
}

答案 1 :(得分:8)

您可以通过覆盖bower包来完成此操作 试试这段代码我编辑了 bower.json ,查找此代码底部的更改。 希望它有效

{
  "name": "watermelon",
  "version": "0.0.0",
  "dependencies": {
    "angular": "^1.3.0",
    "angular-animate": "^1.3.0",
    "angular-bootstrap": "~0.13.3",
    "angular-cookies": "^1.3.0",
    "angular-google-maps-native": "~2.0.0",
    "angular-mocks": "~1.3.0",
    "angular-resource": "^1.3.0",
    "angular-route": "^1.3.0",
    "angular-sanitize": "^1.3.0",
    "angular-scenario": "~1.3.0",
    "angular-touch": "^1.3.0",
    "angular-ui-router": "~0.2.15",
    "bootstrap": "^3.2.0",
    "bootstrap-switch": "~3.3.2",
    "eonasdan-bootstrap-datetimepicker": "~4.15.35",
    "es5-shim": "^4.0.0",
    "font-awesome": "~4.4.0",
    "json3": "^3.3.0",
    "moment": "~2.10.6",
    "ng-tags-input": "3.0.0",
    "requirejs": "latest",
    "requirejs-domready": "latest",
    "stacktrace-js": "~0.6.4",
    "underscore": "~1.8.3"
  },  

"overrides":{
    "font-awesome": {
    "main": [
        "css/font-awesome.min.css"
    ]
    }
 }

}

答案 2 :(得分:2)

bower install components-font-awesome --save

应该修理它 它在包管理器here

下的Github页面上提到

答案 3 :(得分:0)

似乎是凉亭组件&#34; font-awesome&#34;有一些问题。您可以尝试使用#34; components-font-awesome&#34;在你的bower.json中,它将解决不正确注入css文件的问题。你可以在这里查看它的Github回购:https://github.com/components/font-awesome