初次接触Gulp是出于网页模块化的需要,用过之后发现这个任务管理工具有很多实用的插件,意外地好用,于是打算写下这篇笔记把用到的Gulp插件记录一下.至于想了解Gulp基本用法的同学可以去Gulp官网查看API文档,一看便懂. 此处贴上地址https://www.gulpjs.com.cn/docs/api/ gulp-html-import API文档: https://www.npmjs.com/package/gulp-html-import 简介: 引入html内容到另一个html文件的指…

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

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 插件及其基本使用,需要读者对 Gulp 有一个基本的了解.如果你对 Gulp 还不是很了解,可以通过下面两篇文章快速了解 Gulp . 由于几乎所有的插件都有非常友好的使用文档,所以本文不讨论涉及插件使用的东西,仅是一个汇总.排名不分先后. 相关连接导航 在windows下安装gulp —— 基于 Gulp 的前端集成解决方案(一) 执行 $Gul…

1.全局安装cnpm(淘宝的npm国内镜像),gulp,rimraf(卸载用插件)npm install -g cnpm --registry=https://registry.npm.taobao.orgcnpm install -g rimraf gulp 项目下新建package.json和gulpfile.js. 打开package.json添加 {}  花括号,保存. 2.gulp插件(每个项目都要安装一次)cnpm install --save-dev gulp gulp-repla…

原文链接:http://www.mamicode.com/info-detail-517085.html gulp是什么? http://gulpjs.com/ 相信你会明白的! 与著名的构建工具grunt相比,有什么优势呢? 易于使用,代码优于配置 高效,不会产生过多的中间文件,减少I/O压力 易于学习,API非常少,你能在很短的事件内学会gulp 那些常用的gulp插件 No.1.run-sequence Links: https://www.npmjs.com/package/run-se…

第一步:安装Node 首先,gulp 是基于 Nodejs 的自动任务运行器,所以安装gulp之前,最基本也最重要的是,我们需要搭建node环境.访问http://nodejs.org,下载并安装Nodejs ,就一切准备就绪.npm会随着安装包一起安装,稍后会用到它. 为了确保Node已经正确安装,我们执行几个简单的命令:node -v 和 npm -v  来查看一下Nodejs 和 npm的版本号.如果这两行命令没有得到返回,可能node就没有安装正确. 第二步:安装gulp 安装gulp…

gulp简介 gulp 是基于 Nodejs 的自动任务运行器,能自动化地完成javascript/coffee/sass/less/html/image/css等文件的的测试.检查.合并.压缩.格式化.浏览器自动刷新.部署文件生成,并监听文件在改动后重复指定的这些步骤.在实现上, gulp 借鉴了Unix操作系统的管道(pipe)思想,就是前一级的输出,直接变成后一级的输入,使其在操作上非常简单. 安装 gulp是基于node的自动任务运行器,所以需要事先安装好node. 1.全局安装gulp…

源码地址:https://github.com/jiamao/gulp-jmbuild https://github.com/jiamao/gulp-jmbuild gulp-jmbuild gulp插件,用于WEB前端构建 安装 进入您做为构建工具用的目录 1.首先安装gulp $ npm install -g gulp $ npm install --save-dev gulp 2.安装其它依赖[q/gulp-jshint]. $ npm install q $ npm install gu…

关于什么是gulp,它和grunt有什么区别等问题,这里不做任何介绍.本文主要介绍如何使用gulp-usemin这款插件,同时也会简单介绍本文中用到的一些插件. 什么是gulp-usemin 用来将HTML 文件中(或者templates/views)中没有优化的script 和stylesheets 替换为优化过的版本 gulp-usemin根据预先在html文件(或者其它模板/视图中的文件)中声明好的blocks来执行一系列任务(例如合并文件并重全名.排除一些只在开发过程中引入的脚本以及将c…