介绍:Gulp 是基于node.js的一个前端自动化构建工具,可以使用它构建自动化工作流程(前端集成开发环境);不仅能对网站资源进行优化,而且在开发过程中很多重复的任务能够使用正确的工具自动完成,大大提高我们的工作效率。

gulp的相关文件压缩在下一节,传送


初步尝试:

1、安装gulp ,在安装gulp之前要先安装node ,点这里下载

(当前是win,mac用户加sudo)

npm install gulp -g //全局安装gulp

2、创建gulp项目

进入项目目录,在跟目录下执行

npm init    创建一个packpage.json文件   json文件里没有注释

根据命令提示,设置json参数

{
  "name": "test",   //项目名称(必须)
  "version": "1.0.0",   //项目版本(必须)
  "description": "This is for study gulp project !",   //项目描述(必须)
  "homepage": "",   //项目主页
  "repository": {    //项目资源库
    "type": "git",
    "url": "https://git.oschina.net/xxxx"
  },
  "author": {    //项目作者信息
    "name": "simbals",
    "email": "*******@qq.com"
  },
  "license": "ISC",    //项目许可协议
  "devDependencies": {    //项目依赖的插件
    "gulp": "^3.8.11",
    "gulp-less": "^3.0.0"
  }
}

  

3、局部安装gulp

npm install gulp --save-dev 

  --save:将保存配置信息至package.json(package.json是nodejs项目配置文件);

  -dev:保存至package.json的devDependencies节点,不指定-dev将保存至dependencies节点;一般保存在dependencies的像这些express/ejs/body-parser等等。

  使用—save-dev,将通知计算机在package.json中添加gulp依赖。 执行完之后,gulp将创建node_modules文件夹,里面有个gulp文件夹(如下图)


  

4、根目录下创建gulpfile.js文件

var gulp = require('gulp');  //Node去node_modules中查找gulp包
gulp.task('hello', function() { //命名一个简单任务
console.log('Hello World!');
});

5、执行gulp任务

 gulp hello  // hello 是任务名  

 命令行出现 :

Hello World!

gulp使用入门的更多相关文章

  1. gulp详细入门教程

    本文链接:http://www.ydcss.com/archives/18 gulp详细入门教程 简介: gulp是前端开发过程中对代码进行构建的工具,是自动化项目的构建利器:她不仅能对网站资源进行优 ...

  2. 【原】gulp快速入门

    今天刚入职了一家新公司,结果明天就要开始项目了.上级说要用gulp来打包代码,所以今晚花了一晚来看这个gulp, 可以说已经入门了.所以做一个小小的总结 : 首先全局安装gulp npm instal ...

  3. gulp详细入门教程(转载)

    本文转载自: gulp详细入门教程

  4. gulp快速入门

    gulp快速入门 因为之前一直有人给我推荐gulp,说他这里好哪里好的.实际上对我来说够用就行.grunt熟悉以后实际上他的配置也不难,说到效率的话如果真是要完整打包上线也不在乎那么几秒时间,对于项目 ...

  5. gulp快速入门&初体验

    前言 一句话先 gulp 是一个可以简单和自动化"管理"前端文件的构建工具 先说我以前的主要工作,我主要是做游戏服务端的,用c++/python,所以我对东西的概念理解难免要套到自 ...

  6. gulp的使用以及Gulp新手入门教程

    Gulp新手入门教程 原文  http://w3ctrain.com/2015/12/22/gulp-for-beginners/ Gulp 是一个自动化工具,前端开发者可以使用它来处理常见任务: 搭 ...

  7. Gulp新手入门教程

    Gulp 是一个自动化工具,前端开发者可以使用它来处理常见任务: 搭建web服务器 文件保存时自动重载浏览器 使用预处理器如Sass.LESS 优化资源,比如压缩CSS.JavaScript.压缩图片 ...

  8. JS那些事儿——Gulp的入门使用

    前言 新人使用gulp的一个记录. 首先对于第一个新事物,我会问gulp这是什么? 答:gulp是一个自动化构建工具,它可以做一些自动化的任务,比如: 检查Javascript 编译Sass(或Les ...

  9. 前端打包构建工具gulp快速入门

    因为之前一直有人给我推荐gulp,说他这里好哪里好的.实际上对我来说够用就行.grunt熟悉以后实际上他的配置也不难,说到效率的话确实是个问题,尤其项目大了以后,目前位置遇到的项目都还可以忍受.不过不 ...

  10. gulp详细入门教程-gulp demo download

    简介: gulp是前端开发过程中对代码进行构建的工具,是自动化项目的构建利器:她不仅能对网站资源进行优化,而且在开发过程中很多重复的任务能够使用正确的工具自动完成:使用她,我们不仅可以很愉快的编写代码 ...

随机推荐

  1. PeopleSoft JobSet Schedule Table

    PS_SCHDLDEFNPS_SCHDLITEMPS_SCHDLNODEPARMPS_SCHDLNOTIFYPS_SCHDLMESSAGE 其中,PS_SCHDLDEFN中SCHEDULESTATUS ...

  2. 基于Ubuntu的ESP32平台搭建

    提要:针对于Ubuntu下的ESP32搭建,网上有很多博文,乐鑫官网也有指导手册,对于到家都知道的部分我就一带而过,我主要描述搭建过程中遇到的问题和细节. 1.创建一个ESP的目录 I)在家目录下创建 ...

  3. 解题(GoUpstairs -- 上楼梯)

    题目描述 有个小孩正在上楼梯,楼梯有n阶台阶,小孩一次可以上1阶.2阶.3阶.请实现一个方法,计算小孩有多少种上楼的方式.为了防止溢出,请将结果Mod 1000000007 给定一个正整数int n, ...

  4. php+javascript实现的动态显示服务器运行程序进度条功能示例

    本文实例讲述了php+javascript实现的动态显示服务器运行程序进度条功能.分享给大家供大家参考,具体如下: 经常有这样的业务要处理,服务器上有较多的业务需要处理,需要分批操作,于是就需要一个提 ...

  5. LeetCode Smallest Range

    数据范围是3500,3500也就是说n的平方是可以接受的.这里告诉你就是有序的,也就是在提醒你可能会是一个类似于二分的算法,所以的话其实基于这两个认识的话我们就可以利用一个枚举叫二分的算法来解决这道题 ...

  6. Leetcode中sort排序遇到的一些问题

    class Solution { public: static bool cmp(vector<int>a,vector<int>b) { ]-a[]<b[]-b[]; ...

  7. 在进行商业运算时解决BigDecimal的精度丢失问题

    System.out.println(0.05+0.01); System.out.println(1.0-0.42); System.out.println(4.015*100); System.o ...

  8. CentOS 7 安装MongoDB

    一.安装 1.进入网址 https://docs.mongodb.com/manual/tutorial/install-mongodb-on-red-hat/ 按照官方指南进行安装 2.创建文件 / ...

  9. Apache Traffic Server

    1. ats 安装 参考:https://docs.trafficserver.apache.org/en/latest/getting-started/index.en.html#installat ...

  10. 解决time_wait过多

    需要真正找出问题或瓶颈,但调整单机参数能临时解决:(收集自:https://www.cnblogs.com/dadonggg/p/8778318.html) 编辑内核文件/etc/sysctl.con ...