安装gulp 假设已经安装了node 和npm (淘宝的cnpm很适合国内使用). 1.首页全局安装gulp. 1 npm install --global gulp 2.其次局部安装gulp.(注:局部安装是安装到你项目的根目录,这是很多教程没有清晰表明) npm install gulp --save-dev 3.在项目根目录下创建一个名为 gulpfile.js 的文件 var gulp = require('gulp'); gulp.task('default', function()…

gulp系列学习笔记: 1.gulp学习笔记1 2.gulp学习笔记2 3.gulp学习笔记3 4.gulp学习笔记4 1.安装gulp 首先我们需要node环境,nodejs安装这里就不说了,不懂的可以自己百度.在命令行输入 npm install -g gulp 安装完成后可在命令行输入 `gulp -v` 以确认安装成功. 2.压缩js 压缩 js 代码可降低 js 文件大小,提高页面打开速度.在不利用 gulp 时我们需要通过各种工具手动完成压缩工作.但如果js文件比较多时候,手动就比较…

gulp系列学习笔记: 1.gulp学习笔记1 2.gulp学习笔记2 3.gulp学习笔记3 4.gulp学习笔记4 1. 压缩 CSS 压缩 css 代码可降低 css 文件大小,提高页面打开速度. 目标:找到 css/ 目录下的所有 css 文件,压缩它们,将压缩后的文件存放在 dist/css/ 目录下. 在压缩之前,需要安装新的模块,输入以下命令行: npm install gulp-minify-css 在对应目录创建 gulpfile.js 文件并写入如下内容: // 获取 gul…

gulp系列学习笔记: 1.gulp学习笔记1 2.gulp学习笔记2 3.gulp学习笔记3 4.gulp学习笔记4 1.编译sass Sass 是一种 CSS 的开发工具,提供了许多便利的写法,大大节省了开发者的时间,使得 CSS 的开发,变得简单和可维护. 安装相应的模块: npm install gulp-ruby-sass 在 gulpfile.js 文件编写如下代码: / 获取 gulp var gulp = require('gulp') // 获取 gulp-ruby-sass…

Gulp 自动化工具开发非常方便,便于上手,值得使用. 一.Gulp安装 gulp是基于NodeJS运行的,所以需要想安装NodeJS.  http://nodejs.org/download/ 安装gulp # 安装全局环境 npm install gulp -g #安装本地环境 npm install gulp --save-dev 二.Gulp插件安装 npm install browser-sync gulp-compass gulp-sass gulp-rename gulp-jshi…

https://www.gulpjs.com.cn/docs/getting-started/ ,这个是3.9.0版本 后面发现安装的版本是4.0.0,看下面这个: https://github.com/gulpjs/gulp/blob/master/docs/API.md 参考:https://blog.csdn.net/jianjianjianjiande/article/details/79048778?utm_source=copy 4.0.0更新之处: 新的任务系统(基于 bach,替…

gulp系列学习笔记: 1.gulp学习笔记1 2.gulp学习笔记2 3.gulp学习笔记3 4.gulp学习笔记4 之前的任务都是单个的,比较简单.接下去我们开始引用多个插件,一次性把任务搞定,省时又方便. 1.合并压缩js文件 为了提高网页的显示速度,最好是将所有的js文件合并成同一个文件,再来引用,这时候可以用到 gulp-concat 插件:进一步,还可以对其进行压缩.但是有时候我们在写js代码的时候,经常用到 console 语句和 debugger 语句.有时候会忘了删除,这时候我…

本文转载自: Gulp学习指南之CSS合并.压缩与MD5命名及路径替换…

以这次学习gulp为契机来同时了解和学习node相关的知识和概念,比如 npm,package.json等,为以后学习node打好基础. 目录   npm     查看模块     安装模块     卸载模块     更新模块     搜索模块     npm配置     查看版本     帮助   package     创建package.json     package.json的标准格式     依赖下载   gulp     安装gulp     gulpAPI         src…

一.我对gulp的初期理解 是一种前端辅助开发工具 可以帮你把js,css,img等文件 合并.压缩,图片好像是合并为精灵图,合并为精灵图之后,还会生成一个css样式表. 官方解说是:基于流的自动化构建工具. 基于流:应该就是他的语法方式有点像jquery 那样 如: $(".active").css("background":"red").addClass("default");像这样一直点点下去.前一个表达式的输出作为后一…