Grunt的wiredep任务的配置说明文档

Automatically inject Bower components into the HTML file

自动把Bower的组件注入到HTML文件中

如果我们通过以下方式安装组件

bower install jquery --save
bower install sea.js --save

安装后会在bower.json文件中看到

{
  "name": "framework-demo",
  "private": true,
  "dependencies": {
    "jquery": "~2.1.4",
    "jquery-ui": "~1.11.4",
    "knockout": "^3.3.0",
    "seajs": "^3.0.0"
  }
}

在Gruntfile.js文件中配置wirdep Task

  wiredep: {
      app: {
        src: [‘<%= config.app %>/index.html‘],
        ignorePath: /^(\.\.\/)*\.\./
      }
    }

执行grunt wiredep命令

在index.html文件会把默认dependencies依赖中的组件自动注入到下面标签中去。

 <!-- bower:js -->
    <script src="/bower_components/jquery/dist/jquery.js"></script>
    <script src="/bower_components/jquery-ui/jquery-ui.js"></script>
    <script src="/bower_components/knockout/dist/knockout.js"></script>
    <script src="/bower_components/seajs/dist/sea.js"></script>
<!-- endbower --> 

wiredep中的option中的参数

devDependencies：注入开发版中的依赖组件;

dependencies:注入依赖组件；

directory: ‘the directory of your Bower packages.‘ 存放bower包的目录，这个目录是‘.bowerrc‘文件中的.directory