2、gulp安装使用方法介绍【图文】

阅读() @2019-03-17 16:05:18

使用gulp,首先当然是安装nodejs,通过nodejs的npm全局安装和项目安装gulp,其次在项目里安装所需要的gulp插件,然后新建gulp的配置文件gulpfile.js并写好配置信息(定义gulp任务),最后通过命令提示符运行gulp任务即可。

关于nodeJs和npm的具体使用方法,可以参考:学习安装NodeJs环境和NPM

下面正式开始使用gulp:

如果你用的开发工具是WebStorm神奇,那就基本可以省略以下步骤,因为,WebStorm在新建NodeJs项目的时候,会自动导入node_modules和package.json等配置文件,可以省下好多麻烦。

如果用的不是WebStorm,可以尝试以下方法:

第一步:使用cmd命令行工具打开你的项目文件夹

打开cmd命令行,然后依次找到你的项目文件夹,如下图:

使用cmd命令行工具依次打开项目文件夹

第二步:全局安装gulp

1、执行npm install gulp -g

2、检测gulp是否安装成功。如下图,如果可以显示版本号,说明已经安装成功了。

检测npm是否安装成功

第三步:在项目根目录下新建package.json配置文件

使用命令npm init可以新建package.json文件,你也可以手动新建。

使用命令行创建package.json文件

按回车键之后,可以在项目根目录下看到package.json这个文件,打开文件查看,内容与你刚刚在命令行中输入的内容是一致的。

第四步;本地安装gulp插件

注:全局安装gulp是为了执行gulp任务,本地安装gulp则是为了调用gulp插件的功能

进入你的项目文件路径中后,执行npm install gulp --save-dev命令即可。

到目前为止,gulp插件已经全部安装完毕!

微信二维码