1.安装node.js和gulp
2.安装好之后,cmd 命令去检查两个版本以及npm的版本
nulp -v和npm -v分别检查对应的版本,node.js百度,忘了,有点尴尬。。。。
3.npm 初始化:
npm init,一直按回车键就可以,参数有的可填可不填,一直到yes
在文件夹下有packahe.js 如下图:
4.全局安装gulp :
npm install gulp -g 本地安装gulp:npm install gulp --save-dev
本地安装之后如图:
5.在根目录下创建
gulpfile.js
,文件名必须是gulpfile
6.在js中测试,用gulp+任务名测试,如图:
gulp前端自动化构建工具,用来压缩,合并文件之类的操作
1.复制任务
:
还是执行gulp say(gulp+任务名)
gulp.src(globs[, options])
:
输出(Emits)符合所提供的匹配模式(glob)或者匹配模式的数组(array of globs)的文件。 将返回一个
Vinyl files
的
stream
它可以被
piped
到别的插件中。
gulp.dest(path[, options]):
能被 pipe 进来,并且将会写文件。并且重新输出(emits)所有数据,因此你可以将它 pipe 到多个文件夹。如果某文件夹不存在,将会自动创建它。
当你在src的index.html进行操作完时,要在命令行里再次执行gulp,即gulp say(gulp+任务名),那么dist文件夹里的index.html也会跟着变动,但是很麻烦,所以我们需要让其自动跟着变化!!
2.监视任务watch:
gulp.watch(glob [, opts], tasks) 或 gulp.watch(glob [, opts, cb]):
监视文件,并且可以在文件发生改动时候做一些事情。它总会返回一个 EventEmitter 来发射(emit)
change
事件。
7.安装插件,如sass:
https://www.npmjs.com/package/gulp-css-scss/
一,命令行:npm install gulp-scss如图