forked from Automattic/_s
-
-
Notifications
You must be signed in to change notification settings - Fork 0
/
gulpfile.js
224 lines (206 loc) · 8.57 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
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
/**
* gulpfile.js
*
* @summary Asset build tasks with Gulp.js
*
* @link http://gulpjs.com/
* @link https://github.com/gulpjs/gulp
*/
/**
* ----------------------------------------------------------------------------
* Setup
* ----------------------------------------------------------------------------
*/
require('es6-promise').polyfill();
var gulp = require('gulp'),
addsrc = require('gulp-add-src'),
autoprefixer = require('autoprefixer'),
concat = require('gulp-concat'),
fs = require('fs'),
gutil = require('gulp-util'),
insert = require('gulp-insert'),
jshint = require('gulp-jshint'),
plumber = require('gulp-plumber'),
postcss = require('gulp-postcss'),
postcssflexbugsfixes = require('postcss-flexbugs-fixes'),
rename = require('gulp-rename'),
rtlcss = require('gulp-rtlcss'),
sass = require('gulp-sass'),
sourcemaps = require('gulp-sourcemaps'),
uglify = require('gulp-uglify');
var onError = function( err ) {
console.log('An error occurred:', gutil.colors.magenta(err.message));
gutil.beep();
this.emit('end');
};
/**
* ----------------------------------------------------------------------------
* Theme Version.
* ----------------------------------------------------------------------------
*/
var packages = JSON.parse(fs.readFileSync('./package.json'));
var themeVersion = packages.version;
var sassThemeVersion = '$theme-version: \'' + themeVersion + '\';\n';
/**
* ----------------------------------------------------------------------------
* PostCSS Configuration.
*
* @link https://github.com/twbs/bootstrap/blob/eb2e1102be0f4641ee3e5c4e7853360d5a04e3d8/grunt/postcss.js
* ----------------------------------------------------------------------------
*/
var postcssConfig = [
postcssflexbugsfixes(),
autoprefixer({
browsers: [
//
// Official browser support policy:
// https://v4-alpha.getbootstrap.com/getting-started/browsers-devices/#supported-browsers
//
'Chrome >= 35', // Exact version number here is kinda arbitrary
// Rather than using Autoprefixer's native "Firefox ESR" version specifier string,
// we deliberately hardcode the number. This is to avoid unwittingly severely breaking the previous ESR in the event that:
// (a) we happen to ship a new Bootstrap release soon after the release of a new ESR,
// such that folks haven't yet had a reasonable amount of time to upgrade; and
// (b) the new ESR has unprefixed CSS properties/values whose absence would severely break webpages
// (e.g. `box-sizing`, as opposed to `background: linear-gradient(...)`).
// Since they've been unprefixed, Autoprefixer will stop prefixing them,
// thus causing them to not work in the previous ESR (where the prefixes were required).
'Firefox >= 38', // Current Firefox Extended Support Release (ESR); https://www.mozilla.org/en-US/firefox/organizations/faq/
// Note: Edge versions in Autoprefixer & Can I Use refer to the EdgeHTML rendering engine version,
// NOT the Edge app version shown in Edge's "About" screen.
// For example, at the time of writing, Edge 20 on an up-to-date system uses EdgeHTML 12.
// See also https://github.com/Fyrd/caniuse/issues/1928
'Edge >= 12',
'Explorer >= 10',
// Out of leniency, we prefix these 1 version further back than the official policy.
'iOS >= 8',
'Safari >= 8',
// The following remain NOT officially supported, but we're lenient and include their prefixes to avoid severely breaking in them.
'Android 2.3',
'Android >= 4',
'Opera >= 12'
]
})
];
/**
* ----------------------------------------------------------------------------
* Source Files
* ----------------------------------------------------------------------------
*/
var stylesheetPaths = [
'./src/sass/app.scss',
'./node_modules/owl.carousel/dist/assets/owl.carousel.min.css',
'./node_modules/owl.carousel/dist/assets/owl.theme.default.min.css',
'./node_modules/tether/dist/css/tether.min.css'
];
var javascriptPaths = [
'./src/js/*.js',
];
var javascriptVendorPaths = [
'./node_modules/jquery/dist/jquery.min.js',
'./node_modules/owl.carousel/dist/owl.carousel.min.js',
'./node_modules/tether/dist/js/tether.min.js',
'./node_modules/bootstrap/dist/js/bootstrap.min.js'
];
/**
* ----------------------------------------------------------------------------
* Build Tasks
* ----------------------------------------------------------------------------
*/
/**
* ----------------------------------------------------------------------------
* sass
*
* Compile sass / scss files.
*/
gulp.task('sass', function() {
return gulp.src(stylesheetPaths)
.pipe(plumber({ errorHandler: onError })) // Handle errors
.pipe(insert.prepend(sassThemeVersion)) // Add version
.pipe(sass({outputStyle: 'compressed'})) // Compile sass
.pipe(postcss(postcssConfig)) // Transform with PostCSS
.pipe(concat('app.css')) // Concat files to one app.css
.pipe(gulp.dest('./assets/css/')) // Write files.
.pipe(rtlcss()) // Convert to RTL
.pipe(rename({ basename: 'rtl' })) // Rename to rtl.css
.pipe(gulp.dest('./')); // Output RTL stylesheets (rtl.css)
});
/**
* ----------------------------------------------------------------------------
* sass-dev
*
* Compile sass / scss files and include sourcemaps.
*/
gulp.task('sass-dev', function () {
return gulp.src(stylesheetPaths)
.pipe(plumber({ errorHandler: onError })) // Handle errors
.pipe(insert.prepend(sassThemeVersion)) // Add version
.pipe(sourcemaps.init()) // Initialize source maps
.pipe(sass({outputStyle: 'expanded'})) // Compile sass
.pipe(postcss(postcssConfig)) // Transform with PostCSS
.pipe(concat('app.css')) // Concat files to one app.css
.pipe(sourcemaps.write()) // Write source maps
.pipe(gulp.dest('./assets/css/')); // Write files
});
/**
* ----------------------------------------------------------------------------
* sass-theme-style-scss
*
* Compile style.scss.
*/
gulp.task('sass-theme-style-scss', function() {
return gulp.src('./src/sass/style.scss')
.pipe(plumber({ errorHandler: onError })) // Handle errors
.pipe(insert.prepend(sassThemeVersion)) // Add version
.pipe(sass()) // Compile sass
.pipe(concat('style.css')) // Concat files to one app.css
.pipe(gulp.dest('./')); // Write files.
});
/**
* ----------------------------------------------------------------------------
* js
*
* Compile JavaScript files.
*/
gulp.task('js', function() {
return gulp.src(javascriptPaths) // Add local JavaScript paths
.pipe(jshint()) // Detect errors
.pipe(jshint.reporter('default')) // Report errors
.pipe(addsrc(javascriptVendorPaths)) // Add JavaScript vendor paths
.pipe(concat('app.js')) // Concat to single app.js
.pipe(rename({suffix: '.min'})) // Add .min suffix
.pipe(uglify()) // Minify and compress
.pipe(gulp.dest('./assets/js')); // Write files
});
/**
* ----------------------------------------------------------------------------
* js-dev
*
* Compile JavaScript files for development.
*/
gulp.task('js-dev', function() {
return gulp.src(javascriptPaths) // Add local JavaScript paths
.pipe(jshint()) // Detect errors
.pipe(jshint.reporter('default')) // Print errors
.pipe(addsrc(javascriptVendorPaths)) // Add JavaScript vendor paths
.pipe(concat('app.js')) // Concat to single app.js
.pipe(rename({suffix: '.min'})) // Add .min suffix
.pipe(gulp.dest('./assets/js')); // Write files
});
/**
* ----------------------------------------------------------------------------
* watch
*
* Recompile for development on file changes events.
*/
gulp.task('watch', ['sass-dev', 'js-dev'], function() {
gulp.watch('./src/sass/**/*.scss', ['sass-dev']);
gulp.watch(javascriptPaths[0], ['js-dev']);
});
/**
* ----------------------------------------------------------------------------
* [default]
*
* Compile asset files for production.
*/
gulp.task('default', ['sass', 'sass-theme-style-scss', 'js']);