windows下零基础gulp构建
在学习前,先谈谈大致使用gulp的步骤,给读者以初步的认识。首先当然是安装nodejs,通过nodejs的npm全局安装和项目安装gulp,其次在项目里安装所需要的gulp插件,然后新建gulp的配置文件gulpfile.js并写好配置信息(定义gulp任务),最后通过命令提示符运行gulp任务即可。
安装nodejs -> 全局安装gulp -> 项目安装gulp以及gulp插件 -> 配置gulpfile.js -> 运行任务
1、安装nodejs
gulp是基于nodejs,理所当然需要安装nodejs
2、使用命令行
简单介绍gulp在使用过程中常用命令,打开命令提示符执行下列命令(打开方式:window + r 输入cmd回车):
node -v查看安装的nodejs版本,出现版本号,说明刚刚已正确安装nodejs。PS:未能出现版本号,请尝试注销电脑重试;
npm -v查看npm的版本号,npm是在安装nodejs时一同安装的nodejs包管理器,
cd定位到目录,用法:cd + 路径 ;
dir列出文件列表;
cls清空命令提示符窗口内容。
3、npm介绍
说明:npm(node package manager)nodejs的包管理器,用于node插件管理(包括安装、卸载、管理依赖等);
使用npm安装插件:命令提示符执行npm install <name> [-g] [--save-dev]
;
<name>:node插件名称。例:npm install gulp-less --save-dev
-g:全局安装。将会安装在C:\Users\Administrator\AppData\Roaming\npm
,并且写入系统环境变量; 非全局安装:将会安装在当前定位目录; 全局安装可以通过命令行在任何地方调用它,本地安装将安装在定位目录的node_modules文件夹下,通过require()调用;
--save
:将保存配置信息至package.json(package.json是nodejs项目配置文件)
-dev:保存至package.json的devDependencies节点,不指定-dev将保存至dependencies节点;一般保存在dependencies的像这些express/ejs/body-parser等等。
为什么要保存至package.json?因为node插件包相对来说非常庞大,所以不加入版本管理,将配置信息写入package.json并将其加入版本管理,其他开发者对应下载即可(命令提示符执行npm install,则会根据package.json下载所有需要的包,npm install --production
只下载dependencies节点的包)。
4、选装cnpm
官方网址:http://npm.taobao.org;
安装:命令提示符执行npm install cnpm -g --registry=https://registry.npm.taobao.org
; 注意:安装完后最好查看其版本号cnpm -v或关闭命令提示符重新打开,安装完直接使用有可能会出现错误;
注:cnpm跟npm用法完全一致,只是在执行命令时将npm改为cnpm(以下操作将以cnpm代替npm)。
5、全局安装gulp
说明:全局安装gulp目的是为了通过她执行gulp任务;
安装:命令提示符执行cnpm install gulp -g
查看是否正确安装:命令提示符执行gulp -v,出现版本号即为正确安装。
6、新建package.json文件
说明:package.json是基于nodejs项目必不可少的配置文件,它是存放在项目根目录的普通json文件;
命令提示符执行cnpm init 直接安装
7、本地安装gulp插件
安装:定位目录命令后提示符执行cnpm install --save-dev
;
9、运行gulp
命令提示符执行gulp 任务名称;
windows下零基础gulp构建的更多相关文章
- 《Windows编程零基础学》第零节
首先很开心申请到了这一个专栏<Windows编程零基础学> 这是第一篇文章,在这里,我将讲述一些基础的知识. 什么是Windows编程 所谓Windows编程就是在Windows平台上开发 ...
- windows下mongodb基础玩法系列二CURD附加一
windows下mongodb基础玩法系列 windows下mongodb基础玩法系列一介绍与安装 windows下mongodb基础玩法系列二CURD操作(创建.更新.读取和删除) windows下 ...
- windows下mongodb基础玩法系列二CURD操作(创建、更新、读取和删除)
windows下mongodb基础玩法系列 windows下mongodb基础玩法系列一介绍与安装 windows下mongodb基础玩法系列二CURD操作(创建.更新.读取和删除) windows下 ...
- windows下mongodb基础玩法系列一介绍与安装
windows下mongodb基础玩法系列 windows下mongodb基础玩法系列一介绍与安装 windows下mongodb基础玩法系列二CURD操作(创建.更新.读取和删除) windows下 ...
- [置顶] 《Windows编程零基础》__2 一个完整的程序
Windows开发的常识 1)窗口 Windows中最基本的概念也许就是窗口了,每一个前台程序都至少有一个窗口,一个窗口也是你可以看到的部分,比如,QQ有如下的登录窗口 基本上你在Windows中可见 ...
- windows下vue-cli及webpack 构建网站(一)环境安装
1.安装Node.js,node.js安装包及源码下载地址为:https://nodejs.org/en/download/. 2.安装npm,由于新版的nodejs已经集成了npm,所以之前npm也 ...
- 在windows下安装gulp —— 基于 Gulp 的前端集成解决方案(一)
相关连接导航 在windows下安装gulp —— 基于 Gulp 的前端集成解决方案(一) 执行 $Gulp 时发生了什么 —— 基于 Gulp 的前端集成解决方案(二) 常用 Gulp 插件汇总 ...
- 零基础学习Linux(三)linux与windows文件共享
上次的博文零基础学习Linux(一)环境搭建中我们已经将linux环境部署完毕了,接下来我们就可以在linux上进行软件的安装和环境的配置.但在进行这些操作之前,我们还需要解决一个问题——Linux与 ...
- 2018-02-03-PY3下经典数据集iris的机器学习算法举例-零基础
---layout: posttitle: 2018-02-03-PY3下经典数据集iris的机器学习算法举例-零基础key: 20180203tags: 机器学习 ML IRIS python3mo ...
随机推荐
- HTML5利用canvas,把多张图合并成一张图片
需求分析,根据当前网页中的几张图片,在手机上长按,保存图片到相册或者发送给好友. drawCanvas(){ var self = this; var imgsrcArray = [ require( ...
- 开源ERP-成功案例分析(3)
Odoo用户概要 关于Odoo全球的用户,我们来看一些数据: Odoo目前全球有300万使用者 Odoo系统上每天新创建的数据库超过1000个 Odoo和Word.Excel.PowerPoint一样 ...
- MongoDB:数据库介绍与基础操作
二.部署在本地服务器 在上次的学习过程中,我们主要进行了MongoDB运行环境的搭建和可视化工具的安装.此次我们将学习MongoDB有关的基本概念和在adminmongo上的基本操作.该文档中的数据库 ...
- gitbook 入门教程之导出电子书
gitbook 既可以将源码文件单独输出,也可以仅输出单个文件,常见的导出电子书格式主要有三种(ePub, Mobi, PDF),而这三种格式都依赖于系统本身提供的 ebook-convert 工具. ...
- git清空版本记录
在网上找的,记录下来自己使用 1.新增分支 git checkout --orphan latest_branch 2. 添加问题 git add -A 3. 提交 git commit -am &q ...
- SQLServer之存储过程简介
存储过程定义 存储的过程 (存储过程(数据库引擎)) 是存储在数据库中的可执行对象. 存储过程分类 系统存储过程 系统存储过程是 SQL Server系统自身提供的存储过程,可以作为命令执行各种操 ...
- 解决Win10系统本地主机,网络受限占用CPU过高的问题
Win10版本为2015年第一个版本,第一次安装时没有这个问题,后面每次安装后开机正常,但是只要运行一段时间后(机子有运行各种软件的情况),发现CPU使用率为100% 即使结束所有在运行的程序,依然居 ...
- Python列表之班荆道故
列表list初识 列表是python的基础数据类型之一 ,它是以[ ]括起来, 每个元素用' , '隔开而且可以存放各种数据类型: list列表的定义: list_ = []list_1 = [&qu ...
- Windows server 2008R2远程桌面3389端口修改方法技巧
windows server的服务器远程桌面默认端口号是3389,在工作中经常使用远程桌面连接服务器,但是这也是常常被黑客利用的端口号,但是如何修改掉默认端口,预防被黑客利用呢? 可以如下操作配置:很 ...
- jQuery根据radio来控制texteara
最近遇到一个问题:需要通过点击radio来控制texteara的属性变化. 这里主要有两个知识点:1,给texteara设置属性:2,给texteara设置背景颜色. 在这里,假设texteara的i ...