Grunt&凉亭&咕噜-wiredep

时间:2016-02-02 13:10:18

标签: gruntjs bower grunt-wiredep

我一起使用咕噜声和凉亭。将bower组件直接注入index.html grunt-wiredep

但是有一个问题,bower.json中存在的一些依赖关系仍未包含在* .html中

bower.json

{
  "name": "***",
  "version": "***",
  "dependencies": {},
  "devDependencies": {
    "jquery": "~2.1.1",
    "angular": "1.4.x",
    "bootstrap": "~3.1.1",
    ...
  },
  "resolutions": {
    ..
  }
}

gruntfile.js

....
wiredep: {

      task: {
        src: [
          'app/index.html'
        ],
        options: {
          dependencies: true,
          devDependencies: true          
        }
      }
    }
...

的index.html

...

<!-- bower:js -->
<!-- endbower -->

<!-- bower:css -->
<!-- endbower -->

...

结果我没有包含jquery,angular,bootsrap和css for bootstrap的脚本。但是其他一些消息来源已被包括在内。

问题不在 bower.json 内的 main 属性中here

经过一番调查,我发现issue带有bootstrap 3.3.x

但是我的bower.js中的“覆盖”块无效。

有一点似乎非常有趣:(与bootstarp相同)

添加

"jquery": {
      "main": "D:/REPO/XX/current/bower_components/jquery/dist/jquery.js"
    }

覆盖块, wiredep 包括以下index.html

<script src="../bower_components/jquery/D:/REPO/XX/current/bower_components/jquery/dist/jquery.js"></script>

但是当我写了"main": "dist/jquery.js"时,它就被忽略了

1 个答案:

答案 0 :(得分:2)

在我看来,您的项目结构存在一些问题。使用cwd参数。我已成功配置wiredep以使用config添加所需的依赖项:

wiredep: {
    task: {
        src: [
            '<%= cfg.webapp_dir %>/index.html'
        ],
        cwd: '.',
        overrides': {
            'bootstrap': {
                'main': ['less/bootstrap.less', 'dist/css/bootstrap.min.css', 'dist/js/bootstrap.min.js']
            }
        },
        fileTypes: {
            html: {
                replace: {
                    js: '<script src="/{{filePath}}"></script>',
                    css: '<link rel="stylesheet" href="/{{filePath}}" />'
                }
            }
        }
    }
}

这还包括可以完美运行的bootstrap overrides :) 就我而言,bower_dependencies文件夹与index.html所在的目录相同。