Gulp基础
1.什么是gulp?
gulp是前端开发过程中对代码进行构建的工具,是自动化项目的构建利器。
2.为什么使用gulp?
gulp不仅能对网站资源进行优化,而且在开发过程中很多重复的任务能够使用正确的工具自动完成,提高我们的工作效率。
3.gulp介绍?
gulp是基于Nodejs的自动任务运行器, 她能自动化地完成 javascript/coffee/sass/less/html/image/css 等文件的的测试、检查、合并、压缩、格式化、浏览器自动刷新、部署文件生成,并监听文件在改动后重复指定的这些步骤。
在实现上,借鉴了Unix操作系统的管道(pipe)思想,前一级的输出,直接变成后一级的输入,使得在操作上非常简单。
4.基本使用?
a.安装node,npm会随着一并安装。node中文网:http://nodejs.cn/
b.安装完毕,确认安装成功:命令行运行node -v查看node版本;命令行运行npm -v查看npm版本;
c.选装cnpm:npm install cnpm -g --registry=https://registry.npm.taobao.org。确认安装成功,运行cnpm -v查看cnpm版本;
d.全局安装gulp:cnpm install gulp -g。确认安装成功,命令行运行gulp -v查看gulp版本;
e.定位到项目文件夹,将gulp安装到项目本地:cnpm install gulp --save-dev
f.安装任务依赖,新建新建gulpfile文件。示例如下:
安装依赖(示例gulp-less):cnpm install gulp-less --save-dev
新建gulpfile.js文件:(一定是gulpfile这个名称)
var gulp = require('gulp');
var less = require('gulp-less');
gulp.task('less', function() {
gulp.src('./less/*.less')
.pipe(less())
.pipe(gulp.dest('./css'));
});
g.运行gulp任务:gulp [任务名称]
更多细节知识请自行学习。
参考文章:
https://segmentfault.com/a/1190000000372547
http://www.ydcss.com/archives/18
Gulp基础的更多相关文章
- gulp基础操作实践
按照gulp中文文档对gulp基础操作的一些实践练习,记录以防忘掉. 一,选择并输出文件:gulp.src(globs[,options]) eg:gulp.src('src/less/index.l ...
- gulp基础使用总结
gulp 安装 1 检测电脑有没有安装node 执行 $ node -v $ npm -v 如果没有安装的话,可以到https://nodejs.org/en/download/下载安装. 2 全局安 ...
- gulp 基础运用
全局安装gulp $npm install --global gulp 作为项目的开发依赖安装 //--save-dev 开发依赖,储存在package.json的devDependencies中,如 ...
- Gulp基础知识
首先,我们需要了解Gulp能做些什么? 编译 sass sass是什么?(使CSS可以用编程的方式写,加快我们开发的速度) ...
- gulp.基础
1.安装 全局安装 npm install --global gulp 作为项目的开发依赖安装 npm install gulp --save-dev 2.在根目录下创建一个名为gulpfile.js ...
- gulp基础使用及进阶
提示:路径中不允许出现中文,否则scss编译会出错,大概. 按照惯例,先检查一下Node.js.npm(cnpm).gulp的版本号 1.新建package.json 我们可以通过手动新建这个配置文件 ...
- 【gulp】工作中的实战
写这篇文章的目的是为了以后的项目中懒得再去配gulp,直接可以拿这篇博客中的来用,因为有时候配置还是挺烦人的. gulp相关插件的介绍 用法比较简单,假设大家都会用gulp,下面主要介绍一下一些插件的 ...
- Gulp真实项目用例
包括了less预编译,css压缩,html文件include引入,js混淆压缩,本地开发热刷新服务器,html压缩,版本号添加 github地址: gulpfile.js var gulp = req ...
- gulp学习-gulpfile
安装gulp 假设已经安装了node 和npm (淘宝的cnpm很适合国内使用). 1.首页全局安装gulp. 1 npm install --global gulp 2.其次局部安装gulp.(注: ...
随机推荐
- DBMS_NETWORK_ACL_ADMIN
DBMS_NETWORK_ACL_ADMIN学习 转载 http://blog.sina.com.cn/s/blog_4f925fc30102e2se.html 标签: oracle it 分类: 数 ...
- SQL中几个常用的排序函数
最近使用窗口函数的频率越来越高,这里打算简单介绍一下几个排序的函数,做一个引子希望以后这方面的问题能够更深入的理解,这里先简单介绍一下几个简单的排序函数及其相关子句,这里先从什么是排序开始吧 ...
- 0035 Java学习笔记-注解
什么是注解 注解可以看作类的第6大要素(成员变量.构造器.方法.代码块.内部类) 注解有点像修饰符,可以修饰一些程序要素:类.接口.变量.方法.局部变量等等 注解要和对应的配套工具(APT:Annot ...
- java遍历给定目录,树形结构输出所有文件,包括子目录中的文件
(转自:http://blog.csdn.net/gangwazi0525/article/details/7569701) import java.io.File; public class Rea ...
- MMORPG大型游戏设计与开发(服务器 AI 控制器)
上一篇我们说了基础接口的组成,想必大家对AI中的基础方法有了一定的了解,而基础接口只能一个通用的,要实现不同的类别还需子类中实现,这就形成了玩家.主动.被动.木桩这些类型.不同类型的AI需要有一个统一 ...
- Crimm Imageshop 2.3。
下载地址:http://files.cnblogs.com/Imageshop/ImageShop.rar 一款体积小,能绿色执行,又功能丰富的图像处理软件. Imageshop2.3为单EXE文件, ...
- LZ77.py
import math from bitarray import bitarray class LZ77Compressor: """ A simplified impl ...
- 2015最流行的Android组件、工具、框架大全
Android 是目前最流行的移动操作系统之一. 随着新版本的不断发布, Android的功能也日益强大, 涌现了很多流行的应用程序, 也催生了一大批的优秀的组件. 本文试图将目前流行的组件收集起来以 ...
- 如何用Azure Web App Services接入微信公众号
注:本文提到的代码示例下载地址>如何用Azure Web App Services接入微信公众号 如何用Azure Web App Services接入微信公众号 简介 此示例演示如何创建Azu ...
- SQL Server 2012附加数据库时,错误提示如下:尝试打开或创建物理时,CREATE FILE 遇到操作系统错误 5(拒绝访问。)
错误提示:Create File遇到操作系统错误5(拒绝访问) 解决方案: 在所有程序-SQL Server 2012-"SQL Server 配置管理器",点击"SQL ...