我有以下文件夹和文件结构:
供应商引导程序 css -bootstrap.css js -bootstrap.js 字体-awesome css -font-awesome.css nivo-slider -nivo-slider.css 主题 -theme.css -theme-animate.css -theme-blog.css -theme-responsive.css -theme-shop.css我正在尝试以确保css文件以这种特定顺序添加到流中:
1)bootstrap.css文件 src / vendor / bootstrap / css / bootstrap.css $ b 2)所有其他的css文件在'src /供应商/'子目录没有特定的顺序(我将来会增加更多,所以我不想这样做太具体) src / vendor / font-awesome /css/font-awesome.css src / vendor / nivo-slide r / nivo-slider.css 这些特定的css文件在'src / vendor / theme /'目录中并没有特定的顺序 src / vendor / theme / theme.css src / vendor / theme / theme-animate.css src / vendor / theme / theme-blog.css src / vendor / theme / theme-shop.css
4)最后是theme-responsive.css文件 src / vendor / theme / theme-responsive.css
这是我的尝试:
var gulp = require('gulp'); var streamqueue = require('streamqueue'); $ b gulp.task('styles',function(){ var stream = streamqueue({objectMode:true}); //需要的文件在串联的css文件的开头 stream.queue( gulp.src('src / vendor / ** / bootstrap.css')); //现在我想添加大部分剩余的文件,除了已经添加的bootstrap.css文件以及任何带有主题词的文件 stream.queue( gulp.src('src / vendor / ** / * .css','!src / vendor / ** / bootstrap.css','!src / vendor / ** / theme * .css')); //现在我想添加以开头的单词开头的文件,除了theme-responsive.css stream.queue( gulp.src('src / vendor / theme / ** / * .css','!src / vendor / theme / theme-responsive.css')); / /现在我想添加theme-responsive.css文件 stream.queue( gulp .src('src / vendor / theme / theme-responsive.css')); $ b返回stream.done() .pipe(concat(app.css)) .pipe(gulp.dest('public / css /'))});不幸的是,当我运行这个脚本时,它应该忽略bootstrap.css和其他文件正在多次添加。如何使用gulp忽略文件?
解决方案你几乎在那里,感叹号就是'!',只是需要将它作为数组传递:
例如:
流。队列( gulp.src(['src / vendor / theme / ** / *。css','!src / vendor / theme / theme-responsive.css']); );欲了解更多信息: jb.demonte.fr/blog/production-package-with-gulp-js/
希望这会有所帮助。
I have the following folder and file structure:
Vendor bootstrap css -bootstrap.css js -bootstrap.js font-awesome css -font-awesome.css nivo-slider -nivo-slider.css theme -theme.css -theme-animate.css -theme-blog.css -theme-responsive.css -theme-shop.cssI am trying to make sure that the css files are added to the stream in this specific order:
1) The bootstrap.css file src/vendor/bootstrap/css/bootstrap.css
2) All of the other css files inside the 'src/vendor/' sub-directories in no particular order (I will be adding more in the future so I don't want to make this too specific) src/vendor/font-awesome/css/font-awesome.css src/vendor/nivo-slider/nivo-slider.css
3) These specific css files inside the 'src/vendor/theme/' directory in no particular order src/vendor/theme/theme.css src/vendor/theme/theme-animate.css src/vendor/theme/theme-blog.css src/vendor/theme/theme-shop.css
4) And finally the theme-responsive.css file src/vendor/theme/theme-responsive.css
Here is my attempt:
var gulp = require('gulp'); var streamqueue = require('streamqueue'); gulp.task('styles', function() { var stream = streamqueue({ objectMode: true }); // file that needs to be at the beginning of the concatenated css file stream.queue( gulp.src('src/vendor/**/bootstrap.css') ); //Now I want to add most of the remaining files, except for the bootstrap.css file that was already added as well as any files with the word theme at the beginning of it stream.queue( gulp.src('src/vendor/**/*.css', '!src/vendor/**/bootstrap.css', '!src/vendor/**/theme*.css') ); //Now I would like to add the files that begin with the word theme at the beginning, except for theme-responsive.css stream.queue( gulp.src('src/vendor/theme/**/*.css', '!src/vendor/theme/theme-responsive.css') ); //Now I would like to add the theme-responsive.css file stream.queue( gulp.src('src/vendor/theme/theme-responsive.css') ); return stream.done() .pipe(concat("app.css")) .pipe(gulp.dest('public/css/')) });Unfortunately, when I currently run this script, the bootstrap.css and other files that it should be ignoring are being added multiple times. How do I ignore a file using gulp?
解决方案You are almost there, the exclamation character is for it '!', just need to pass it as array:
eg:
stream.queue( gulp.src([ 'src/vendor/theme/**/*.css', '!src/vendor/theme/theme-responsive.css' ]); );For more information: jb.demonte.fr/blog/production-package-with-gulp-js/
Hope this helps.
更多推荐
如何使用gulp忽略文件?
发布评论