Gulp环境搭建

时间秒杀一切 提交于 2020-02-22 22:49:14

网址: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的命令一样)

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!