基于node安装gulp-一些命令
1.win+r:进入cdm
2.node -v:查询是否安装node
3.npm install -g gulp:安装gulp
4.gulp -v:查看是否安装gulp
5.cd desk:进入桌面
6.cd 20170410:进入文件夹
7.npm init:对文件夹进行重置
8.一些描述,可写可不写:
9.npm install gulp --save-dev:将gulp安装到项目中:
10.安装多个模块:
11.npm install gulp-uglify --save-dev:压缩js文件需要安装的模块
12.在根目录文件下新建一个gulpfile.js文件
13.引入模块信息
//实现压缩js文件
var gulp = require("gulp");
//实现压缩js文件模块
var uglify = require("gulp-uglify");
var concat = require('gulp-concat');
var open = require('gulp-open');
var connect = require('gulp-connect');
14.创建任务
gulp.task('js', function() {
//1.找到源代码
//*.js:所有的js文件
//.src()找源码路径
gulp.src("src/js/*.js")
.pipe(uglify())//2.进行压缩代码
.pipe(concat('all.js'))//2.5进行合并
.pipe(gulp.dest("./dist/js"))//3.将压缩文件输出
.pipe(connect.reload())//4.检测修改时页面刷新
- });
15.添加open模块默认打开浏览器的地址(uri::打开地址)
// uri:打开的地址
gulp.task('open', function(){
gulp.src('src/*.html')
.pipe(open({uri:'http://localhost:8088'}));
});
16.检测是否被修改
gulp.task("auto",function(){
//监听文件修改
gulp.watch('src/js/*.js',['js'])
gulp.watch('src/*.html',['html'])
gulp.watch('src/css/*.css',['css'])
});
17.设置gulp的默认任务
// 设置gulp的默认任务
gulp.task('default', ['connect','open', 'auto','js','html','css']);
18.运行成功: