gulp是基于Node.js的自动任务运行器。可以自动完成html、image、css和js等文件的检测、检查、合并、压缩、格式化等,并监听文件在改动后重复指定的这些步骤。

一.首先,我全局安装了gulp

npm install -g gulp

  此时,可以将gulp理解为 node的一个模块

二.使用

  基于具体的某个项目。

  ※ 项目安装gulp,本地方式来安装

  ※ 安装相应的gulp插件

  ※ 配置gulpfile.js  需要编写一些js代码,编写任务

  ※ 运行任务

    注意全局安装和本地安装的各自作用

    全局安装,是为了在任何地方,可以使用gulp 命令来执行任务。

    本地安装,是因为在编写任务的时候,需要用到gulp模块中的一些功能(方法/函数)

  简单实例:

    第一步,新建一个目录 gulp-demo,作为项目目录

    第二步,本地安装gulp

         gulp-demo中本地打开cmd命令:

npm install gulp

        这里问题来了

        

      提示“open....package.json”,但是发现安装完后不存在package.json,此时,就必须新建一个package.json

      执行命令

npm init

  

  完成!

  说明:

  第三步,编写gulpfile.js文件

//引入gulp模块
const gulp=require('gulp');
//编写第一个任务
gulp.task('task1',function(){
setInterval(function(){
console.log('hello,gulp!');
},200);
})

  运行

  

   项目目录结构:

  

  

参考文章:http://www.ydcss.com/archives/18#lesson6

gulp填坑记(一)的更多相关文章

  1. gulp填坑记(二)——gulp多张图片自动合成雪碧图

    为优化图片,减少请求会把拿到切好的图标图片,通过ps(或者其他工具)把图片合并到一张图里面,再通过css定位把对于的样式写出来引用的html里面,对于一些图片较多的项目,这个过程可能要花费我们一天的时 ...

  2. UiAutomator2.0升级填坑记

    UiAutomator2.0升级填坑记 SkySeraph May. 28th 2017 Email:skyseraph00@163.com 更多精彩请直接访问SkySeraph个人站点:www.sk ...

  3. Android项目开发填坑记-Fragment的onBackPressed

    Github版 CSDN版 知识背景 Fragment在当前的Android开发中,有两种引用方式,一个是 Android 3.0 时加入的,一个是supportV4包中的.这里简称为Fragment ...

  4. Android项目开发填坑记-Fragment的onAttach

    背景 现在Android开发多使用一个Activity管理多个Fragment进行开发,不免需要两者相互传递数据,一般是给Fragment添加回调接口,让Activity继承并实现. 回调接口一般都写 ...

  5. Android项目开发填坑记-so文件引发的攻坚战

    故事的最初 我负责的项目A要求有播放在线视频的功能,当时从别人的聊天记录的一瞥中发现百度有相关的SDK,当时找到的是Baidu-T5Player-SDK-Android-1.4s,项目中Demo的so ...

  6. minikube windows hyperx填坑记

    minikube windows hyperx填坑记 安装了一天半,还是没行,先放弃 开始 minikube start --vm-driver=hyperv --hyperv-virtual-swi ...

  7. 浅谈html5 video 移动端填坑记

    这篇文章主要介绍了浅谈html5 video 移动端填坑记,小编觉得挺不错的,现在分享给大家,也给大家做个参考.一起跟随小编过来看看吧 本文介绍了html5 video 移动端填坑记,分享给大家,具体 ...

  8. Java web 开发填坑记 2 -如何正确的创建一个Java Web 项目

    转载请标明出处:http://blog.csdn.net/zhaoyanjun6/article/details/72566261 本文出自[赵彦军的博客] Java web 开发填坑记 1-如何正确 ...

  9. Appium+python自动化(十三)- 输入中文 - 一次填坑记(超详解)

    简介 无论你在哪里,在做什么都会遇到很多坑,这些坑有些事别人挖的,有些是自己挖的.别人挖的叫坑人,自己挖的叫自杀,儿子挖的叫坑爹.因此在做app自动化道路上也不会是一帆风顺的,你会踩很多坑,这些坑和你 ...

随机推荐

  1. linux下安装redis和phpredis扩展

    一.安装redis 1.下载redis-3.2.3.tar.gz wget http://download.redis.io/releases/redis-3.2.3.tar.gz 2.解压redis ...

  2. Hazelcast分布式

    一般的应用正式环境中都不止一台服务器(也就是说是集群的),那么如果只是简单的将数据预加载到内存,那么就会有数据不同步的现象. (更新了其中一台JVM,另一台JVM并不会收到通知从而保持数据同步). 这 ...

  3. 帧动画的创建方式 - 纯Java代码方式

    废话不多说,先看东西 帧动画的创建方式主要以下2种: * 用xml创建动画: * 纯Java代码创建动画:   本文内容主要关注 纯java代码创建帧动画 的方式: 用xml创建帧动画:http:// ...

  4. python 内置函数之lambda-filter-reduce-apply-map

    (1)lambda lambda是Python中一个很有用的语法,它允许你快速定义单行最小函数.类似于C语言中的宏,可以用在任何需要函数的地方. 基本语法如下: 函数名 = lambda args1, ...

  5. Jetty入门(1-2)eclipse集成jetty插件并发布运行应用

    一.eclipse集成jetty插件 1.从市场安装jetty插件 2.使用jetty插件发布应用和配置运行环境 debug配置默认共用上述run配置 3.使用jetty插件启动运行和停止运行选中的应 ...

  6. python与mongodb的交互 增删改差

    首先引入包: pip install pymongo需要用到如下对象: MongoClient对象:用于与MongoDB服务器建立连接 client=MongoClient('主机ip',端口) Da ...

  7. python网络编程基础(一)

    一.C/S架构 客户端/服务端架构 二.OSI七层架构 七层模型,亦称OSI(Open System Interconnection)参考模型,是参考模型是国际标准化组织(ISO)制定的一个用于计算机 ...

  8. Spark:将RDD[List[String,List[Person]]]中的List[Person]通过spark api保存为hdfs文件时一直出现not serializable task,没办法找到"spark自定义Kryo序列化输入输出API"

    声明:本文转自<在Spark中自定义Kryo序列化输入输出API>   在Spark中内置支持两种系列化格式:(1).Java serialization:(2).Kryo seriali ...

  9. linux文件访问权限(像rw-r--rw-是什么意思)

    Linux的文件访问权限分为 读.写.执行三种 r:可读(4) w:可写(2)对目录来说则可新建文件 x:可执行(1)对目录来说则可进入该目录 可用 ls -l 查看文件 像上图的-rw-r--rw- ...

  10. hdu1249 三角形分割平面---递推

    题目链接: http://acm.hdu.edu.cn/showproblem.php?pid=1249 题目大意: 用N个三角形最多可以把平面分成几个区域? 思路: 知道了直线和折线分割平面的情况这 ...