标签: wiredep

我有几个亭子部件,其中我需要像一些部件json3,respondjs,es5shim以在IE8条件块被添加(在构建以及服务)这样的:

<!--[if lt IE 9]> <script src="bower_components/json3/json3.js"></script> <![endif]-->

我该如何着手编写任务？我找不到任何合适的例子gulp-inject以及wiredep这个问题.请指教

我试图在Gulp任务中使用Wiredep在我的index.html文件中注入Bower依赖项.以下任务(没有Wiredep)运行正常.

gulp.task('build', ['copy', 'assets'], function(){

    return gulp.src('app/index.html')
    .pipe(inject(gulp.src(['dist/assets/js/*.js', 'dist/assets/css/*.css'], {read: false}), {relative: true}))
    .pipe(gulp.dest('dist'));
});

现在我尝试添加Wiredep:

var wiredep = require('wiredep');

gulp.task('build', ['copy', 'assets'], function(){

    return gulp.src('app/index.html')
    .pipe(wiredep())
    .pipe(inject(gulp.src(['dist/assets/js/*.js', 'dist/assets/css/*.css'], {read: false}), {relative: true}))
    .pipe(gulp.dest('dist'));
});

结果如下:

[09:45:11] TypeError: dest.on is not a function
    at DestroyableTransform.Readable.pipe (C:\GIT\myApp\myApp-front\node_module
s\gulp-debug\node_modules\through2\node_modules\readable-stream\lib\_stream_read
able.js:533:8)
    at Gulp.<anonymous> (C:\GIT\myApp\myApp-front\gulpfile.js:38:6)
    at module.exports (C:\GIT\myApp\myApp-front\node_modules\gulp\node_modules\
orchestrator\lib\runTask.js:34:7)
    at Gulp.Orchestrator._runTask (C:\GIT\myApp\myApp-front\node_modules\gulp\n
ode_modules\orchestrator\index.js:273:3)
    at Gulp.Orchestrator._runStep (C:\GIT\myApp\myApp-front\node_modules\gulp\n
ode_modules\orchestrator\index.js:214:10)
    at C:\GIT\myApp\myApp-front\node_modules\gulp\node_modules\orchestrator\ind
ex.js:279:18
    at finish (C:\GIT\myApp\myApp-front\node_modules\gulp\node_modules\orchestr
ator\lib\runTask.js:21:8)
    at C:\GIT\myApp\myApp-front\node_modules\gulp\node_modules\orchestrator\lib
\runTask.js:52:4
    at f (C:\GIT\myApp\myApp-front\node_modules\gulp\node_modules\orchestrator\
node_modules\end-of-stream\node_modules\once\once.js:17:25)
    at …

我正在寻找一种简单的方法将选项文件传递给wiredep,这允许我在角度上设置jquery,到目前为止,它依赖于依赖项,因此它在底部设置了jquery.

我作为选择传递:

var options = {
  bowerJson: require('./bower.json'),
  directory: './bower_components/',
  ignorePath: '../..'
};

devDependencies设置为True,我在文档中找不到允许我这样做的任何参数

我的bower.json文件中有angular,angular-ui-router和socket-io.

当我运行我的gulp文件(使用wiredep)时,两个角度脚本成功添加到我的index.html文件,但socket.io脚本不是 - 我无法弄清楚原因.谢谢你的帮助

//命令行

[21:56:06] Using gulpfile ~/dev/projects/ecommerceVidChat/gulpfile.js
[21:56:06] Starting 'default'...
[21:56:06] Starting 'bower-dependencies'...
[21:56:06] Finished 'bower-dependencies' after 6.24 ms
[21:56:06] Finished 'default' after 7.24 ms

//bower.json

  "dependencies": {
    "angular": "~1.3.13",
    "socket.io": "~1.3.4",
    "angular-ui-router": "~0.2.13"
  }

// gulpfile.js

var gulp = require('gulp'),
    wiredep = require('wiredep').stream;

gulp.task('default', function() {
  gulp.start('bower-dependencies')
});

gulp.task('bower-dependencies', function () {  
  gulp.src('./build/index.html') 
    .pipe(wiredep({
      directory: './build/bower_components',
      bowerJson: require('./bower.json'),
    }))
    .pipe(gulp.dest('./build/'));
});

//index.html

<!-- bower:js -->
<script src="bower_components/angular/angular.js"></script>
<script src="bower_components/angular-ui-router/release/angular-ui-router.js"></script>
<!-- endbower -->

//package.json

"devDependencies": {
    "gulp": "^3.8.11" …

我成功地使用grunt-wiredep包将bower组件注入到我的视图标记中,我目前正在将视图从HTML移植到Jade.但是,当我运行构建脚本时,bower脚本不像我使用HTML时那样注入页面.

我已将src参数更改为引用index.jade而不是index.html.有什么想法为什么注射不起作用？