-
Notifications
You must be signed in to change notification settings - Fork 23
/
Copy pathgulpfile.js
112 lines (99 loc) · 3.1 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
'use strict';
const del = require('del');
const fractal = require('@frctl/fractal').create();
const gulp = require('gulp');
const path = require('path');
const rename = require('gulp-rename');
const sass = require('gulp-sass');
const sourcemaps = require('gulp-sourcemaps');
const tildeImporter = require('node-sass-tilde-importer');
fractal.set('project.title', 'carbon-addons-cloud');
fractal.components.set('path', path.join(__dirname, 'src/components'));
fractal.components.set('default.preview', '@preview');
fractal.components.set('preview', {});
fractal.web.set('server.sync', true);
fractal.web.set('static.path', path.join(__dirname, 'css'));
fractal.web.set('builder.dest', path.join(__dirname, 'build'));
const logger = fractal.cli.console;
let server;
gulp.task('clean', () => {
return del(['build', 'css', 'scss']);
});
gulp.task('fractal:start', ['clean'], () => {
server = fractal.web.server({
sync: true,
syncOptions: {
files: ['./src/**/*.scss'],
},
});
server.on('error', err => logger.error(err.message));
return server.start().then(() => {
logger.success(`Local URL: ${server.url}`);
logger.success(`Network URL: ${server.urls.sync.external}`);
});
});
/*
* Run a static export of the project web UI.
*
* This task will report on progress using the 'progress' event emitted by the
* builder instance, and log any errors to the terminal.
*
* The build destination will be the directory specified in the 'builder.dest'
* configuration option set above.
*/
gulp.task('fractal:build', ['clean', 'styles:build'], () => {
const builder = fractal.web.builder();
builder.on('progress', (completed, total) =>
logger.update(`Exported ${completed} of ${total} items`, 'info')
);
builder.on('error', err => logger.error(err.message));
return builder.build().then(() => {
logger.success('Fractal build completed!');
});
});
gulp.task('styles:copy', ['clean'], () => {
return gulp
.src('./src/**/*.scss')
.pipe(
rename(path => {
if (path.dirname === '.' && path.basename === 'index') {
path.basename = 'styles';
}
})
)
.pipe(gulp.dest('scss'));
});
gulp.task('styles:build', ['clean', 'styles:copy'], () => {
const config = {
includePaths: [path.resolve(__dirname, './node_modules')],
importer: tildeImporter,
};
return Promise.all([
gulp
.src('./src/**/*.scss')
.pipe(sourcemaps.init())
.pipe(sass(config))
.pipe(rename('styles.css'))
.pipe(sourcemaps.write('.'))
.pipe(gulp.dest('css')),
gulp
.src('./src/**/*.scss')
.pipe(sourcemaps.init())
.pipe(sass(config))
.pipe(
require('gulp-postcss')([
require('autoprefixer')({
browsers: ['last 1 version'],
}),
require('cssnano')(),
])
)
.pipe(rename('styles.min.css'))
.pipe(sourcemaps.write('.'))
.pipe(gulp.dest('css')),
]);
});
gulp.task('build', ['clean', 'styles:build', 'fractal:build']);
gulp.task('develop', ['clean', 'styles:build', 'fractal:start'], () => {
gulp.watch('./src/**/*.scss', ['styles:build']);
});