欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页

gulp教程1:gulp环境搭建

程序员文章站 2022-06-07 13:18:57
...

gulp环境搭建

gulp是一款基于stream的前端构建工具,下面就是安装教程

1. 初始化package.json

命令行: npm init -y 

a. 需要node.js支持,初始化一个package.json文件

 如果输入命令:npm init,系统会向用户提问一系列问题,如果你觉得不用修改默认配置,一路回车就可以了。如果使用了 -f(代表force)、-y(代表yes),则跳过提问阶段,直接生成一个新的 package.json 文件。

b. package.json文件
 里面有项目依赖,当别人使用我们json文件时,可以通过命令行来安装依赖的插件,让文件正常运行。

安装所有依赖文件命令行:

npm install 	

2. 全局安装 gulp:

npm install --global gulp

上面会安装最新版本的gulp,如果想要安装指定版本,带@版本号,比如安装3.9.1版本gulp

npm install  --global  [email protected]	

gulp安装是否成功的标志:

gulp -v 

出现"CLI version 版本号"就代表安装成功了

3. 作为项目的开发依赖

npm install --save-dev gulp    (--save-dev 是写在一起的)

之所以全局安装了gulp,还要项目中再装一次,主要是为了进行版本和依赖的控制。方便当项目再被人电脑运行时,不至于因gulp版本不同而产生bug。

4. 创建gulpfile.js 的文件:

在项目根目录下创建一个名为 gulpfile.js 的文件,里面存放的是要执行的任务。

5. 运行 gulp:

gulp 任务名

默认的名为 default 的任务(task)将会被运行。想要单独执行特定的任务(task),请输入 gulp 任务名。

比如:

var gulp = require('gulp');
gulp.task('default', function() {
  //将你的默认的任务代码放在这
});
相关标签: gulp