-
Notifications
You must be signed in to change notification settings - Fork 0
/
gulpfile.js
executable file
·131 lines (121 loc) · 3.47 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
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
var gulp = require("gulp"),
sass = require("gulp-sass")(require("sass")),
postcss = require("gulp-postcss"),
autoprefixer = require("autoprefixer"),
cssnano = require("cssnano"),
connect = require("gulp-connect-php"),
sourcemaps = require("gulp-sourcemaps"),
browserSync = require("browser-sync").create();
var babel = require("gulp-babel");
var concat = require("gulp-concat");
var uglify = require("gulp-uglify");
var browserSync = require("browser-sync").create();
var del = require("del");
var paths = {
styles: {
// By using styles/**/*.scss we're telling gulp to check all folders for any sass file
src: "src/sass/**/*.scss",
// Saving to root of site/project (this works well if you're building WP themes)
dest: "./",
// Use this if you prefer a css folder
// dest: './css/'
},
scripts: {
src: "src/js/**/*.js",
dest: "assets/js/",
},
};
function clean() {
// You can use multiple globbing patterns as you would with `gulp.src`,
// for example if you are using del 2.0 or above, return its promise
return del(["assets"]);
}
function styles() {
return gulp
.src(paths.styles.src)
.pipe(sourcemaps.init())
.pipe(sass())
.on("error", sass.logError)
.pipe(
postcss([
autoprefixer({
grid: true,
browsers: ["last 2 version"],
}),
cssnano(),
])
)
.pipe(sourcemaps.write())
.pipe(gulp.dest(paths.styles.dest))
.pipe(browserSync.stream());
}
function scripts() {
return (
gulp
.src(paths.scripts.src, { sourcemaps: true })
// .pipe(babel())
// .pipe(uglify())
.pipe(concat("main.min.js"))
.pipe(gulp.dest(paths.scripts.dest))
);
}
function productionStyles() {
return gulp
.src(paths.styles.src)
.pipe(sass())
.on("error", sass.logError)
.pipe(
postcss([
autoprefixer({
grid: true,
browsers: ["last 2 version"],
}),
cssnano(),
])
)
.pipe(gulp.dest(paths.styles.dest));
}
function productionScripts() {
return gulp
.src(paths.scripts.src, { sourcemaps: true })
.pipe(babel())
.pipe(uglify())
.pipe(concat("main.min.js"))
.pipe(gulp.dest(paths.scripts.dest));
}
function reload() {
browserSync.reload();
}
function watch() {
connect.server({
port: 8888,
},
function() {
browserSync.init({
proxy: "http://localhost:8888/",
// Use this to proxy a localhost (EG if you're using [l/m]amp)
// proxy: 'dev.mysite'
});
}
);
gulp.watch(paths.scripts.src, scripts);
gulp.watch(paths.styles.src, styles);
var codeFileWatcher = gulp.watch(["**/*.html", "**/*.php"]);
codeFileWatcher.on("change", function(path) {
console.log("Code File " + path + " was changed, running tasks...");
reload();
});
}
var production = gulp.series(
clean,
gulp.parallel(productionStyles, productionScripts)
);
exports.clean = clean;
exports.styles = styles;
exports.scripts = scripts;
exports.watch = watch;
exports.production = production;
/*
* Define default task that can be called by just running `gulp` from cli:
*/
exports.default = watch;