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

来源：互联网发布：淘宝关键词你懂的编辑：程序博客网时间：2024/06/01 20:26

Automatically inject Bower components into the HTML file

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

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

bower install jquery --savebower 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

1 0