相关连接导航
在windows下安装gulp —— 基于 Gulp 的前端集成解决方案(一)
执行 $Gulp 时发生了什么 —— 基于 Gulp 的前端集成解决方案(二)
常用 Gulp 插件汇总 —— 基于 Gulp 的前端集成解决方案(三)
构建一个基本的前端自动化开发环境 —— 基于 Gulp 的前端集成解决方案(四)
一、准备工作
1、什么是 npm?
npm 是 nodejs 的包管理工具,主要功能就是管理、更新、搜索、发布node的包。Gulp 就是通过 NPM 安装的。关于 NPM 中文介绍,这里有一篇非常不错的文章:http://www.cnblogs.com/chyingp/p/npm.html
完整的 NPM 文档请看这里 :https://docs.npmjs.com
2、安装 Node.js 并升级 NPM 到最新版本
nodejs 安装:打开 nodejs.org 下载 nodejs 安装包,并根据提示安装,这里不做赘述。
npm 升级:当安装完 nodejs 后,npm 就已经可用,打开命令行执行 npm -v 如果正确显示版本号,则说明安装没有问题。由于npm的更新速度比nodejs 要快,所以输入 npm install npm -g 升级npm 。
3、gitbash
windows 下的命令行工具 CMD 实在难用,这里推荐一个替代方案,建议安装 gitbash 。反正少不了使用 GIT ,只需在安装 GIT 时选择 gitbash 组件即可。GIT 的安装这里也不做太多说明,有疑问的可以在回复中提问。
4、什么是 gulp
gulp 官方的介绍是 用自动化构建工具增强你的工作流程! —— Automate and enhance your workflow!其有着易于使用、构建快速、高质量插件丰富、易于学习等众多优势。下一节中会仔细讨论和领略 gulp 的风采!
二、安装 gulp
千呼万唤始出来,终于到 gulp 登场的时候了。如果你已经对前面的三个步骤感到疲倦,那么安装 gulp 这一步就是让你稍作休息的绝佳时机。 Gulp 的开发团队将其安装过程做的相当完美,不需要复杂的配置,不需要漫长的等待。 废话不说,进入正题:
首先,打开 gitbash 这个利器,找一个位置,创建并进入一个项目文件夹,并输入下列命令来完成 gulp 的安装。
全局安装请执行
$ npm install --global gulp
在项目目录安装请输入
$ npm install --save-dev gulp
然后,创建一个名为 gulpfile.js 的配置文件在当前目录下,并输入下面的代码,这里创建了一个空的任务(仅作为用于测试gulp是否正常工作)
var gulp = require('gulp');
gulp.task('default', function() {
// place code for your default task here
});
最后,执行 $ gulp 运行gulp,如果正确输出类似下面的信息,则说明gulp 已经正确安装并运行。
$ gulp
[::] Using gulpfile xxx\gulpfile.js
[::] Starting 'default'...
[::] Finished 'default' after μs
$_
至此,gulp 就已经安装完毕,下面要做的就是熟悉如何使用gulp,以及其周边生态。
写在后面
关于本文如果您有任何建议或疑问请在下面留言交流。
在windows下安装gulp —— 基于 Gulp 的前端集成解决方案(一)的更多相关文章
windows下安装Apache、php、mysql集成环境
一.准备工作 本次安装的版本分别为:apache2.4 .php5.6 . mysql5.7 下载地址为:http://pan.baidu.com/s/1boQNIOn 密码:zarx 二.安装步骤 ...
基于svnserve的SVN服务器(windows下安装与配置)
基于svnserve的SVN服务器(windows下安装与配置) 基于svnserve的SVN服务器(windows下安装与配置)关键字: svn 安装SVNserve 从http://subvers ...
构建一个基本的前端自动化开发环境 —— 基于 Gulp 的前端集成解决方案(四)
通过前面几节的准备工作,对于 npm / node / gulp 应该已经有了基本的认识,本节主要介绍如何构建一个基本的前端自动化开发环境. 下面将逐步构建一个可以自动编译 sass 文件.压缩 ja ...
常用 Gulp 插件汇总 —— 基于 Gulp 的前端集成解决方案(三)
前两篇文章讨论了 Gulp 的安装部署及基本概念,借助于 Gulp 强大的 插件生态 可以完成很多常见的和不常见的任务.本文主要汇总常用的 Gulp 插件及其基本使用,需要读者对 Gulp 有一个基本 ...
执行 $Gulp 时发生了什么 —— 基于 Gulp 的前端集成解决方案(二)
前言 文章 在windows下安装gulp —— 基于 Gulp 的前端集成解决方案(一) 中,已经完成对 gulp 的安装,由于是window环境,文中特意提到了可以通过安装 gitbash 来代替 ...
Redhat/Ubuntu/Windows下安装Docker
Redhat/Ubuntu/Windows下安装Docker 什么是Docker Docker是Docker.inc公司开源的一个基于LXC技术之上构建的Container容器引擎,基于Go语言并遵从 ...
windows 下安装redis并且测试(php)
Window 下安装 下载地址:https://github.com/dmajkic/redis/downloads. 下载到的Redis支持32bit和64bit.根据自己实际情况选择,将64bit ...
在windows下安装配置Ulipad
在windows下安装配置Ulipad 今天推荐一款轻便的文本编辑器Ulipad,用来写一些小的Python脚本非常方便. Ulipad下载地址: https://github.com/limodou ...
windows下安装redis以及测试
Window 下安装 下载地址:https://github.com/dmajkic/redis/downloads. 下载到的Redis支持32bit和64bit.根据自己实际情况选择,将64bit ...
随机推荐
javascript中的this与函数讲解
前言 javascript中没有块级作用域(es6以前),javascript中作用域分为函数作用域和全局作用域.并且,大家可以认为全局作用域其实就是Window函数的函数作用域,我们编写的js代码, ...
HashMap与TreeMap源码分析
1. 引言 在红黑树--算法导论(15)中学习了红黑树的原理.本来打算自己来试着实现一下,然而在看了JDK(1.8.0)TreeMap的源码后恍然发现原来它就是利用红黑树实现的(很惭愧学了Ja ...
Vue + Webpack + Vue-loader 系列教程(2)相关配置篇
原文地址:https://lvyongbo.gitbooks.io/vue-loader/content/ 使用预处理器 在 Webpack 中,所有的预处理器需要和一个相应的加载器一同使用.vue- ...
安卓易学,爬坑不易——腾讯老司机的RecyclerView局部刷新爬坑之路
针对手游的性能优化,腾讯WeTest平台的Cube工具提供了基本所有相关指标的检测,为手游进行最高效和准确的测试服务,不断改善玩家的体验.目前功能还在免费开放中. 点击地址:http://wetest ...
谈谈一些有趣的CSS题目(五)-- 单行居中,两行居左,超过两行省略
开本系列,讨论一些有趣的 CSS 题目,抛开实用性而言,一些题目为了拓宽一下解决问题的思路,此外,涉及一些容易忽视的 CSS 细节. 解题不考虑兼容性,题目天马行空,想到什么说什么,如果解题中有你感觉 ...
.net 分布式架构之业务消息队列
开源QQ群: .net 开源基础服务 238543768 开源地址: http://git.oschina.net/chejiangyi/Dyd.BusinessMQ ## 业务消息队列 ##业务消 ...
zookeeper源码分析之四服务端(单机)处理请求流程
上文: zookeeper源码分析之一服务端启动过程 中,我们介绍了zookeeper服务器的启动过程,其中单机是ZookeeperServer启动,集群使用QuorumPeer启动,那么这次我们分析 ...
前端开发:面向对象与javascript中的面向对象实现(二)构造函数与原型
前端开发:面向对象与javascript中的面向对象实现(二)构造函数与原型 前言(题外话): 有人说拖延症是一个绝症,哎呀治不好了.先不说这是一个每个人都多多少少会有的,也不管它究竟对生活有多么大的 ...
设计模式C#合集--工厂方法模式
简单工厂,代码: public interface ISpeak { public void Say(); } public class Hello : ISpeak { public void Sa ...
无法访问org.springframework.core.NestedRuntimeException 找不到org.springframework.core.NestedRuntimeException的类文件
在学习springAOP时,出现如下异常: 无法访问org.springframework.core.NestedRuntimeException 找不到org.springframework.cor ...