-
Notifications
You must be signed in to change notification settings - Fork 0
/
gulpfile.js
116 lines (101 loc) · 3.84 KB
/
gulpfile.js
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
var app = { // 定义目录
srcPath:'src/bankList/',
buildPath:'build/bankList/',
distPath:'dist/bankList/'
}
/*1.引入gulp与gulp插件 使用时,要去下载这些插件*/
var gulp = require('gulp');
var less = require('gulp-less');
var cssmin = require('gulp-cssmin');
var uglify = require('gulp-uglify');
var concat = require('gulp-concat');
var connect = require('gulp-connect');
var imagemin = require('gulp-imagemin');
var open = require('open');
var postcss = require('gulp-postcss');
var px2rem = require('postcss-px2rem');
/*把bower下载的前端框架放到我们项目当中*/
gulp.task('lib',function () {
gulp.src('bower_components/common/*.js')
.pipe(gulp.dest(app.srcPath+'lib'))
.pipe(gulp.dest(app.buildPath+'lib'))
.pipe(gulp.dest(app.distPath+'lib'))
.pipe(connect.reload()); //当内容发生改变时, 重新加载。
gulp.src('bower_components/common/*.css')
.pipe(gulp.dest(app.srcPath+'lib'))
.pipe(gulp.dest(app.buildPath+'lib'))
.pipe(gulp.dest(app.distPath+'lib'))
.pipe(connect.reload()); //当内容发生改变时, 重新加载。
});
/*2.定义任务 把所有html文件移动另一个位置*/
gulp.task('html',function () {
/*要操作哪些文件 确定源文件地址*/
gulp.src(app.srcPath+'**/*.html') /*src下所有目录下的所有.html文件*/
.pipe(gulp.dest(app.buildPath)) //gulp.dest 要把文件放到指定的目标位置
.pipe(gulp.dest(app.distPath))
.pipe(connect.reload()); //当内容发生改变时, 重新加载。
});
/*3.执行任务 通过命令行。gulp 任务名称*/
/*px转rem,暂不需要*/
// gulp.task('pxtorem', function() {
// var processors = [px2rem({remUnit: 37.5})];
// return gulp.src('./src/*.css')
// .pipe(postcss(processors))
// .pipe(gulp.dest('./dest'));
// });
/*定义编译less任务 下载对应的插件 gulp-less
* 把less文件转成css放到build
* */
gulp.task('less',function () {
gulp.src(app.srcPath+'style/index.less')
.pipe(less())
.pipe(gulp.dest(app.buildPath+'css/'))
/*经过压缩,放到dist目录当中*/
.pipe(cssmin())
.pipe(gulp.dest(app.distPath+'css/'))
.pipe(connect.reload())
});
/*合并js*/
gulp.task('js',function () {
gulp.src(app.srcPath+'js/**/*.js')
.pipe(concat('index.js'))
.pipe(gulp.dest(app.buildPath+'js/'))
.pipe(uglify())
.pipe(gulp.dest(app.distPath+'js'))
.pipe(connect.reload())
});
/*压缩图片*/
gulp.task('image',function () {
gulp.src(app.srcPath+'images/**/*')
.pipe(gulp.dest(app.buildPath+'images'))
.pipe(imagemin())
.pipe(gulp.dest(app.distPath+'images'))
.pipe(connect.reload())
});
/*同时执行多个任务 [其它任务的名称]
* 当前bulid时,会自动把数组当中的所有任务给执行了。
* */
gulp.task('build',['less','html','js','image','lib']);
/*定义server任务
* 搭建一个服务器。设置运行的构建目录
* */
gulp.task('server',['build'],function () {
/*设置服务器*/
connect.server({
root:[app.buildPath],//要运行哪个目录
livereload:true, //是否热更新。
port:9966 //端口号
})
/*监听哪些任务*/
gulp.watch('bower_components/**/*',['lib']);
gulp.watch(app.srcPath+'**/*.html',['html']);
gulp.watch(app.srcPath+'js/**/*.js',['js']);
gulp.watch(app.srcPath+'images/**/*',['image']);
gulp.watch(app.srcPath+'style/**/*.less',['less']);
//通过浏览器把指定的地址 (192.168.60.36:9966)打开。
open('http://localhost:9966');
});
/*定义默认任务
* 直接执行gulp 会调用的任务
* */
gulp.task('default',['server']);