利用gulp工具来压缩css文件
来源:互联网 发布:fifa online数据库 编辑:程序博客网 时间:2024/05/22 15:30
压缩 css 代码可降低 css 文件大小,提高页面打开速度,因此也可以提高网页的性能,接下来我们来看一下,我们怎么利用gulp工具来进行css文件的压缩。
1)首先我们先安装gulp这个工具,安装这个工具之前需要本地环境支持node.js,所以我们首先安装的是node.js,这个倒是挺容易安装的,去官网去下载.mis安装包,很快我们就可以安装好了。安装了node.js,里面内置有npm(包管理器),我们可以直接使用npm来直接安装gulp,但是为了安装速度快一点,我们可以采用国内的淘宝镜像来进行安装。
在命令提示符中输入:
npm install -g cnpm --registry=https://registry.npm.taobao.org
之后我们就使用cnpm来代替npm.
2)然后在global环境和项目文件中都install gulp
npm install gulp -g (global环境)
npm install gulp --save-dev (项目环境)
3)在项目中install需要的gulp插件,一般只压缩的话需要
npm install gulp-minify-css gulp-concat gulp-uglify gulp-rename del --save-dev
更多插件可以在这个链接中找到 http://gratimax.NET/search-gulp-plugins/
4)在你的文件的根目录下建立一个gulpfile.js文件
然后在里面写
var gulp = require('gulp'), minifycss = require('gulp-minify-css'), concat = require('gulp-concat'), uglify = require('gulp-uglify'), rename = require('gulp-rename'), del = require('del');gulp.task('css',function(){return gulp.src('css/*.css').pipe(minifycss()).pipe(gulp.dest('minifyed/css'))});gulp.task('default',['css']);.pipe(minifycss()):指的是压缩文件,.pipe(gulp.dest('minifyed/css')):指的是把压缩后的文件放进minifyed文件夹中的css文件中。
5)然后在命令提示符中,在文件夹的目录下,运行gulp命令行,就可以将css文件压缩。
阅读全文
0 0
- 利用gulp工具来压缩css文件
- 利用gulp.js压缩css,js文件流程
- 使用gulp压缩css文件
- gulp压缩js和css文件
- gulp压缩css
- gulp入门实例{css文件,img文件的压缩}
- gulp入门-压缩js/css文件(windows)
- gulp压缩js和css
- gulp压缩js和css
- gulp压缩js/less(css)
- 使用gulp压缩js,css
- 如何通过gulp构建工具来编译less文件
- gulp 压缩合并Css 混淆压缩js
- Gulp压缩、合并js/css文件,压缩图片以及热更新教程
- Gulp压缩合并js/css文件,压缩图片,以及热更新教程
- Gulp实现css、js、图片的压缩以及css、js文件的MD5命名
- gulp,css压缩,js压缩,css加密,js加密
- gulp合并压缩JS和CSS
- jsoup爬取需要登录的网页(个人备份)
- java笔记
- css : transform
- day_03_查找算法、排序算法
- 认真学习php面向对象-1
- 利用gulp工具来压缩css文件
- node.js 循环的陷阱
- SpringMVC-入门程序
- Linux常用命令
- Java的12个重要知识点
- 菱形继承
- 两个工程之间跳转
- 单片机中断(定时器)实践
- 关于lua正则表达式的一些诡异表现和思考