Gulp环境搭建

网址：https://www.gulpjs.com.cn/

一、Gulp简介

gulp是前端开发过程中自动化项目的构建利器；她不仅能对网站资源进行优化，而且在开发过程中很多重复的任务能够使用正确的工具自动完成；gulp是基于Nodejs的。

Gulp能完成 Javascript/coffee/sass/less/html/image/css 等文件的的测试、检查、合并、压缩、格式化、浏览器自动刷新、部署文件生成，并监听文件在改动后重复指定的这些步骤。

在实现上，Gulp借鉴了Unix操作系统的管道（pipe）思想，前一级的输出，直接变成后一级的输入，使得在操作上非常简单。

gulp 和 grunt 非常类似，但相比于 grunt 的频繁 IO 操作，gulp 的流操作，能更快地更便捷地完成构建工作。

二、Gulp环境搭建

1、安装nodejs

1）、说明：gulp是基于nodejs，理所当然需要安装nodejs；nodejs官网（https://nodejs.org/en/）

2）、测试：

按window + r 输入cmd回车，

然后输入node -v

然后输入npm -v 如果都能打印出相应版本信息，那么说明你配置成功了；如果提示“不是内部或者外部命令”，那就需要配置环境变量。

https://blog.csdn.net/jiang7701037/article/details/80707786

3)、 npm的解释：

npm是Node.js的包管理工具（package manager）。在Node.js开发时，会用到很多别人写的Javascript代码。如果需要使用别人写的某个包，每次都根据名称搜索一下官方网站，下载代码，解压，再使用，非常繁琐。于是一个集中管理的工具应运而生：大家都把自己开发的模块打包后放到npm官网上，如果要使用，直接通过npm安装就可以直接用，不用管代码存在哪，应该从哪下载。

更重要的是，如果我们要使用模块A，而模块A又依赖于模块B，模块B又依赖于模块X和模块Y，npm可以根据依赖关系，把所有依赖的包都下载下来并管理起来。否则，靠我们自己手动管理，肯定既麻烦又容易出错。

npm已经在Node.js安装的时候顺带装好了。我们在命令提示符或者终端输入npm -v

2、安装cnpm

cmd(命令行)执行

npm install cnpm -g --registry=https://registry.npm.taobao.org

因为npm安装插件是从国外服务器下载，受网络影响大，可能出现异常，如果npm的服务器在中国就好了，所以我们乐于分享的淘宝团队干了这事。

注意：安装完后最好查看其版本号cnpm -v或关闭命令提示符重新打开，安装完直接使用有可能会出现错误；

将路径C:\Users\asus\AppData\Roaming\npm\node_modules\cnpm配置到环境变量中，这样就可以在全局范围内使用cnpm命令了

注：cnpm跟npm用法完全一致，只是在执行命令时将npm改为cnpm（以下操作将以cnpm代替npm）。

3、全局安装gulp（给计算机(操作系统)安装软件）

命令：cnpm install gulp -g

测试：gulp -v

注意配置环境变量（C:\Users\asus\AppData\Roaming\npm\gulp）

全局安装gulp的目的是：可以使用gulp命令（就跟使用npm的命令一样）

• 
  
  点赞
  


• 
  
  收藏


• 
  
  分享


• 
  

  
  

  
  
  • 文章举报