本文介绍了如何在Gulp中添加特定的bower组件作为IE8条件块的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
我有几个bower组件,其中我需要一些组件,如 json3
, respondjs
, es5shim
将添加到IE8条件块(在构建和服务中),如下所示:
I have several bower components, of which I need some components like json3
, respondjs
, es5shim
to be added in an IE8 conditional block (in build as well as serve) like this :
<! - [if lt IE 9]>
< script src =bower_components / json3 / json3.js>< / script>
<![endif] - >
我应该如何继续编写任务?对于此问题,我找不到任何合适的示例 gulp-inject
以及 wiredep
。请告知
How should I proceed to write the task? I could not find any suitable examples with gulp-inject
as well as wiredep
for this issue. Please advise
推荐答案
可以使用和。
假设您在索引中定义了以下注入。 html
:
<!--[if lt IE 9]>
<![endif]-->
<!-- inject:js -->
<!-- endinject -->
您可以在gulpfile中连接它们:
You can wire them in gulpfile:
var gulp = require('gulp')
var bowerFiles = require('main-bower-files');
var gulpFilter = require('gulp-filter');
var gulpInject = require('gulp-inject');
gulp.task('wiredep', function() {
var ie8Files = ['**/json3.js', '**/es5shim.js'];
// the same as: var restFiles = ['*', '!**/json3.js', '!**/es5shim.js'];
var restFiles = ['*'].concat(ie8Files.map(function(e) { return '!' + e;}));
return gulp.src('index.html')
.pipe(gulpInject(gulp.src(bowerFiles(), {read: false}).pipe(gulpFilter(restFiles))))
.pipe(gulpInject(gulp.src(bowerFiles(), {read: false}).pipe(gulpFilter(ie8Files)),
{starttag: '<!--[if lt IE 9]>', endtag: '<![endif]-->'}))
.pipe(gulp.dest('dist'));
});
导致(例如):
<!--[if lt IE 9]>
<script src="bower_components/json3/json3.js"></script>
<script src="bower_components/shim/es5shim.js"></script>
<![endif]-->
<!-- inject:js -->
<script src="bower_components/jquery/jquery.js"></script>
<!-- endinject -->
这篇关于如何在Gulp中添加特定的bower组件作为IE8条件块的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!