一切福田，不離方寸，從心而覓，感無不通。

Daily Archives: 2019年7月22日

常用gulp配置文件

package.josn

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
{
  "name": "g-ex",
  "version": "1.0.0",
  "description": "a gulp template",
  "main": "index.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "keywords": [],
  "author": "",
  "license": "ISC",
  "devDependencies": {
    "autoprefixer": "^7.1.4",
    "babel-core": "^6.26.0",
    "babel-preset-env": "^1.6.0",
    "gulp": "^3.9.1",
    "gulp-babel": "^7.0.0",
    "gulp-clean-css": "^3.9.0",
    "gulp-concat": "^2.6.1",
    "gulp-connect": "^5.0.0",
    "gulp-less": "^3.3.2",
    "gulp-postcss": "^7.0.0",
    "gulp-rename": "^1.2.2",
    "gulp-sourcemaps": "^2.6.1",
    "gulp-uglify": "^3.0.0",
    "http-proxy-middleware": "^0.17.4",
    "uglify-es": "^3.1.3"
  },
  "dependencies": {
    "gulp-file-include": "^1.2.0"
  }
}

  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
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
var gulp = require('gulp');
var connect = require('gulp-connect');
var babel = require('gulp-babel');
var sourcemaps = require('gulp-sourcemaps');
var rename = require('gulp-rename');
var uglify = require('gulp-uglify');
var less = require('gulp-less');
var cleanCss = require('gulp-clean-css');
var autoprefixer = require('autoprefixer');
var postCss = require('gulp-postcss');
var proxy = require('http-proxy-middleware');
var fileinclude = require('gulp-file-include');
 
// 起服务
gulp.task('connect', function() {
    connect.server({
        root: 'dist',
        livereload: true,
        port: 8888,
        middleware: function(connect, opt) {
           return [
              //   proxy('/printbox',  {
              //       target: 'http://172.20.8.30:8891',
              //       changeOrigin:true
              //  }),
              // proxy('/user',  {
              //   target: 'http://192.168.0.168:8099/user',//代理的目标地址
              //   changeOrigin:true,//
              //   pathRewrite:{//路径重写规则
              //       '^/user':''
              //   }
              // }),
           ]
       }
    });
});
 
// html文件
gulp.task('html', function() {
    gulp.src('./*.html')
      .pipe(fileinclude({
        prefix: '@@',//变量前缀 @@include
        basepath: './inc',//引用文件路径
        indent:true//保留文件的缩进
    }))
      .pipe(connect.reload())
      .pipe(gulp.dest('./dist'));
});
 
// css文件
gulp.task('less', ['html'], function() {
  gulp.src('./css/*.css')
    .pipe(connect.reload())
    .pipe(gulp.dest('./dist/css'));
 
  gulp.src('./css/images/*.*')
    .pipe(connect.reload())
    .pipe(gulp.dest('./dist/css/images'));
});
// gulp.task('less', ['html'], function() {
//     gulp.src('./src/css/*.less')
//         .pipe(less())
//         .pipe(postCss([autoprefixer({browsers: ['last 2 versions']})]))
//         .pipe(gulp.dest('./dist/css'))
//         .pipe(cleanCss())
//         .pipe(rename({extname: '.min.css'}))
//     .pipe(connect.reload())
//         .pipe(gulp.dest('./dist/css/min'))
// });
 
// js文件
gulp.task('js', function() {
  gulp.src('./js/*.js')
      .pipe(connect.reload())
      .pipe(gulp.dest('./dist/js'));
});
// gulp.task('js',['html'] , function () {
//     gulp.src('./src/js/*.js')
//         .pipe(sourcemaps.init())
//         .pipe(babel({
//             presets: ['env']
//         }))
//         .pipe(gulp.dest('./dist/js'))
//         .pipe(uglify())
//         .pipe(rename({extname: '.min.js'}))
//     .pipe(sourcemaps.write())
//     .pipe(connect.reload())
//         .pipe(gulp.dest('./dist/js/min'))
// });
 
// 图片
gulp.task('img', function () {
    gulp.src('./images/*.*')
      .pipe(connect.reload())
      .pipe(gulp.dest('./dist/images'));
 
      gulp.src('./images/*.*')
      .pipe(connect.reload())
      .pipe(gulp.dest('./dist/images/'));
      
      gulp.src('./images/banners/*.*')
      .pipe(connect.reload())
      .pipe(gulp.dest('./dist/images/banners'));
 
      gulp.src('./images/blog-post/*.*')
      .pipe(connect.reload())
      .pipe(gulp.dest('./dist/images/blog-post'));
 
      gulp.src('./images/payments/*.*')
      .pipe(connect.reload())
      .pipe(gulp.dest('./dist/images/payments'));
 
      gulp.src('./images/products/*.*')
      .pipe(connect.reload())
      .pipe(gulp.dest('./dist/images/products'));
 
      gulp.src('./images/sliders/*.*')
      .pipe(connect.reload())
      .pipe(gulp.dest('./dist/images/sliders'));
 
      gulp.src('./images/testimonials/*.*')
      .pipe(connect.reload())
      .pipe(gulp.dest('./dist/images/testimonials'));
});
 
// fonts
gulp.task('font', function(){
  gulp.src('./fonts/*.*')
    .pipe(connect.reload())
    .pipe(gulp.dest('./dist/fonts'));
});
 
// 监控
gulp.task('watch', function() {
    gulp.watch(['./*.html','./inc/*.html'], ['html']);
 
    gulp.watch(['./js/*.js'], ['js']);
 
    gulp.watch(['./css/*.css'], ['less']);
});
 
// 默认任务
gulp.task('default', ['connect', 'watch', 'js', 'less', 'img', 'font']);

  from:https://www.cnblogs.com/changzhenan/p/8329864.html

龙生   22 Jul 2019
View Details

Copyright © 2025 Longsheng All rights reserved