CSS minify and rename with gulp(CSS 使用 gulp 缩小和重命名)
问题描述
我有一个类似的变量
var files = {
'foo.css': 'foo.min.css',
'bar.css': 'bar.min.css',
};
我希望 gulp 为我做的是 minify
文件,然后为我 rename
.
What I want the gulp to do for me is to minify
the files and then rename
for me.
但任务当前写为(针对一个文件)
But the tasks is currently written as (for one file)
gulp.task('minify', function () {
gulp.src('foo.css')
.pipe(minify({keepBreaks: true}))
.pipe(concat('foo.min.css'))
.pipe(gulp.dest('./'))
});
如何重写以使其与上面定义的变量 files
一起使用?
How to rewrite so it work with my variable files
defined above?
推荐答案
您应该能够使用 Glob 为您的 src 选择所需的任何文件,而不是在对象中定义它们,这应该会简化您的任务.此外,如果您希望将 css 文件缩小为单独的文件,则无需将它们连接起来.
You should be able to select any files you need for your src with a Glob rather than defining them in an object, which should simplify your task. Also, if you want the css files minified into separate files you shouldn't need to concat them.
var gulp = require('gulp');
var minify = require('gulp-minify-css');
var rename = require('gulp-rename');
gulp.task('minify', function () {
gulp.src('./*.css')
.pipe(minify({keepBreaks: true}))
.pipe(rename({
suffix: '.min'
}))
.pipe(gulp.dest('./'))
;
});
gulp.task('default', ['minify'], function() {
});
这篇关于CSS 使用 gulp 缩小和重命名的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持编程学习网!
本文标题为:CSS 使用 gulp 缩小和重命名
基础教程推荐
- 用于 Twitter 小部件宽度的 HTML/CSS 2022-01-01
- 自定义 XMLHttpRequest.prototype.open 2022-01-01
- 直接将值设置为滑块 2022-01-01
- Vue 3 – <过渡>渲染不能动画的非元素根节点 2022-01-01
- Chart.js 在线性图表上拖动点 2022-01-01
- 我可以在浏览器中与Babel一起使用ES模块,而不捆绑我的代码吗? 2022-01-01
- Electron 将 Node.js 和 Chromium 上下文结合起来意味着 2022-01-01
- html表格如何通过更改悬停边框来突出显示列? 2022-01-01
- 如何使用JIT在顺风css中使用布局变体? 2022-01-01
- 如何使用TypeScrip将固定承诺数组中的项设置为可选 2022-01-01