gulp处理LESS,以及js压缩
利用Gulp处理:
- LESS转CSS
- JS文件压缩
- 监听文件变化,如果文件发生变化,自动处理以上命令
package.json
JavaScript 全选
{
"name": "YESCMSs",
"version": "1.0.0",
"description": "An ASP.NET Core application for getting started with Less",
"main": "index.js",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1"
},
"private": true,
"keywords": [
"aspnetcore",
"less"
],
"author": "anuraj",
"license": "MIT",
"devDependencies": {
"gulp": "3.9.1",
"gulp-clean-css": "3.9.0",
"gulp-less": "3.3.2",
"gulp-utf8-convert": "^0.0.7",
"gulp-watch": "^5.0.1"
}
}
JavaScript 全选
var gulp = require("gulp"),
watch = require('gulp-watch'),
cleanCss = require("gulp-clean-css"),
less = require("gulp-less"),
utf8Convert = require('gulp-utf8-convert'),
// 获取 uglify 模块(用于压缩 JS)
uglify = require('gulp-uglify');
gulp.task("less", function () {
return gulp.src('wwwroot/less/*.less')
.pipe(less())
.pipe(utf8Convert())
.pipe(cleanCss({ compatibility: 'ie8' }))
.pipe(gulp.dest('wwwroot/css'));
});
// 压缩 js 文件
// 在命令行使用 gulp script 启动此任务
gulp.task('script', function () {
// 1\. 找到文件
gulp.src('wwwroot/js-source/*.js')
// 2\. 压缩文件
.pipe(uglify())
// 3\. 另存压缩后的文件
.pipe(gulp.dest('wwwroot/js'))
})
// 文件发生变化的时候,自动处理
gulp.task('watch:less', function () {
return watch('wwwroot/less/*.less', function () {
gulp.start('less'); //执行html任务
/* browserSync.reload(); //刷新浏览器*/
});
});
gulp.task('watch:script', function () {
return watch('wwwroot/js-source/*.js', function () {
gulp.start('script'); //执行html任务
/* browserSync.reload(); //刷新浏览器*/
});
});
gulp.task("watch", function () {
gulp.start('watch:less', 'watch:script')
});
//parallel()将任务功能和/或组合操作组合成同时执行的较大操作。
gulp.task("default", function () {
gulp.start('less', 'script')
});
版权声明:本文为YES开发框架网发布内容,转载请附上原文出处连接
post 管理员