Gulp文件操作APi

1、基本用法

//载入src和dist方法
const { src,dest } = require('gulp');
//通过src创建读取流
//pipe:导出
//dist：写入流
//读取流路径：src/*.css
//写入流路径：dist
exports.default = () => {
   return src('src/*.css').pipe(dest('dist'));
}

2、css文件压缩转换 

安装gulp-clean-css

yarn add gulp-clean-css

使用

//载入压缩插件
const cleanCss = require('gulp-clean-css');

完整代码

//载入src和dist方法
const { src,dest } = require('gulp');
//载入压缩插件
const cleanCss = require('gulp-clean-css');
//通过src创建读取流
//pipe:导出
//dist：写入流
//读取流路径：src/*.css
//写入流路径：dist
//css文件压缩转换 gulp-clean-css
exports.default = () => {
   return src('src/*.css')
   .pipe(cleanCss())
   .pipe(dest('dist'));
}

3、文件重命名

安装gulp-rename插件

yarn add gulp-rename --dev

载入gulp-name插件

//载入rename插件
const reName = require('gulp-rename');

完整使用

//载入src和dist方法
const { src,dest } = require('gulp');
//载入压缩插件
const cleanCss = require('gulp-clean-css');
//载入rename插件
const reName = require('gulp-rename');
//通过src创建读取流
//pipe:导出
//dist：写入流
//读取流路径：src/*.css
//写入流路径：dist
//css文件压缩转换 gulp-clean-css
exports.default = () => {
   return src('src/*.css')
   .pipe(cleanCss())
   .pipe(reName({extname:'.min.css'}))
   .pipe(dest('dist'));
}