1 |
|
2 |
|
3 |
|
4 |
|
5 |
|
6 |
|
7 |
|
8 | 'use strict';
|
9 |
|
10 | var packageData = require('./package.json');
|
11 | var moduleMap = require('./scripts/module-map');
|
12 | var fbjsConfigurePreset = require('babel-preset-fbjs/configure');
|
13 | var del = require('del');
|
14 | var gulpCheckDependencies = require('fbjs-scripts/gulp/check-dependencies');
|
15 | var gulp = require('gulp');
|
16 | var babel = require('gulp-babel');
|
17 | var cleanCSS = require('gulp-clean-css');
|
18 | var concatCSS = require('gulp-concat-css');
|
19 | var derequire = require('gulp-derequire');
|
20 | var flatten = require('gulp-flatten');
|
21 | var header = require('gulp-header');
|
22 | var gulpif = require('gulp-if');
|
23 | var rename = require('gulp-rename');
|
24 | var gulpUtil = require('gulp-util');
|
25 | var StatsPlugin = require('stats-webpack-plugin');
|
26 | var through = require('through2');
|
27 |
|
28 | var webpackStream = require('webpack-stream');
|
29 |
|
30 | var paths = {
|
31 | dist: 'dist',
|
32 | lib: 'lib',
|
33 | src: [
|
34 | 'src/**/*.js',
|
35 | '!src/**/__tests__/**/*.js',
|
36 | '!src/**/__mocks__/**/*.js',
|
37 | ],
|
38 | css: ['src/**/*.css'],
|
39 | };
|
40 |
|
41 | var babelOptsJS = {
|
42 | presets: [
|
43 | fbjsConfigurePreset({
|
44 | stripDEV: true,
|
45 | rewriteModules: {map: moduleMap},
|
46 | }),
|
47 | ],
|
48 | plugins: [
|
49 | require('@babel/plugin-proposal-nullish-coalescing-operator'),
|
50 | require('@babel/plugin-proposal-optional-chaining'),
|
51 | require('@babel/plugin-proposal-class-properties')
|
52 | ],
|
53 | };
|
54 |
|
55 | var babelOptsFlow = {
|
56 | presets: [
|
57 | fbjsConfigurePreset({
|
58 | target: 'flow',
|
59 | rewriteModules: {map: moduleMap},
|
60 | }),
|
61 | ],
|
62 | plugins: [
|
63 | require('@babel/plugin-proposal-nullish-coalescing-operator'),
|
64 | require('@babel/plugin-proposal-optional-chaining'),
|
65 | require('@babel/plugin-proposal-class-properties')
|
66 | ],
|
67 | };
|
68 |
|
69 | var COPYRIGHT_HEADER = `/**
|
70 | * Recoil v<%= version %>
|
71 | *
|
72 | * Copyright (c) Facebook, Inc. and its affiliates.
|
73 | *
|
74 | * This source code is licensed under the MIT license found in the
|
75 | * LICENSE file in the root directory of this source tree.
|
76 | */
|
77 | `;
|
78 |
|
79 | var buildDist = function(opts) {
|
80 | var webpackOpts = {
|
81 | externals: {
|
82 | immutable: {
|
83 | root: 'Immutable',
|
84 | commonjs2: 'immutable',
|
85 | commonjs: 'immutable',
|
86 | amd: 'immutable',
|
87 | },
|
88 | react: {
|
89 | root: 'React',
|
90 | commonjs2: 'react',
|
91 | commonjs: 'react',
|
92 | amd: 'react',
|
93 | },
|
94 | 'react-dom': {
|
95 | root: 'ReactDOM',
|
96 | commonjs2: 'react-dom',
|
97 | commonjs: 'react-dom',
|
98 | amd: 'react-dom',
|
99 | },
|
100 | },
|
101 | output: {
|
102 | filename: opts.output,
|
103 | libraryTarget: 'umd',
|
104 | library: 'Recoil',
|
105 | },
|
106 | plugins: [
|
107 | new webpackStream.webpack.DefinePlugin({
|
108 | 'process.env.NODE_ENV': JSON.stringify(
|
109 | opts.debug ? 'development' : 'production',
|
110 | ),
|
111 | }),
|
112 | new webpackStream.webpack.LoaderOptionsPlugin({
|
113 | debug: opts.debug,
|
114 | }),
|
115 | new StatsPlugin(`../meta/bundle-size-stats/${opts.output}.json`, {
|
116 | chunkModules: true,
|
117 | }),
|
118 | ],
|
119 | };
|
120 |
|
121 |
|
122 |
|
123 | const wpStream = webpackStream(webpackOpts, null, function(err, stats) {
|
124 | if (err) {
|
125 | throw new gulpUtil.PluginError('webpack', err);
|
126 | }
|
127 | if (stats.compilation.errors.length) {
|
128 | gulpUtil.log('webpack', '\n' + stats.toString({colors: true}));
|
129 | }
|
130 | });
|
131 | return wpStream;
|
132 | };
|
133 |
|
134 | gulp.task(
|
135 | 'clean',
|
136 | gulp.series(function() {
|
137 | return del([paths.dist, paths.lib]);
|
138 | }),
|
139 | );
|
140 |
|
141 | gulp.task(
|
142 | 'modules',
|
143 | gulp.series(function() {
|
144 | return gulp
|
145 | .src(paths.src)
|
146 | .pipe(babel(babelOptsJS))
|
147 | .pipe(flatten())
|
148 | .pipe(gulp.dest(paths.lib));
|
149 | }),
|
150 | );
|
151 |
|
152 | gulp.task(
|
153 | 'flow',
|
154 | gulp.series(function() {
|
155 | return gulp
|
156 | .src(paths.src)
|
157 | .pipe(babel(babelOptsFlow))
|
158 | .pipe(flatten())
|
159 | .pipe(rename({extname: '.js.flow'}))
|
160 | .pipe(gulp.dest(paths.lib));
|
161 | }),
|
162 | );
|
163 |
|
164 | gulp.task(
|
165 | 'css',
|
166 | gulp.series(function() {
|
167 | return (
|
168 | gulp
|
169 | .src(paths.css)
|
170 | .pipe(
|
171 | through.obj(function(file, encoding, callback) {
|
172 | var contents = file.contents.toString();
|
173 | var replaced = contents.replace(
|
174 |
|
175 |
|
176 | /\/\*.*?\*\/|'(?:\\.|[^'])*'|"(?:\\.|[^"])*"|url\([^)]*\)|(\.(?:public\/)?[\w-]*\/{1,2}[\w-]+)/g,
|
177 | function(match, cls) {
|
178 | if (cls) {
|
179 | return cls.replace(/\//g, '-');
|
180 | } else {
|
181 | return match;
|
182 | }
|
183 | },
|
184 | );
|
185 | replaced = replaced.replace(
|
186 |
|
187 | /\bvar\(([\w-]+)\)/g,
|
188 | function(match, name) {
|
189 | var vars = {
|
190 | 'fig-secondary-text': '#9197a3',
|
191 | 'fig-light-20': '#bdc1c9',
|
192 | };
|
193 | if (vars[name]) {
|
194 | return vars[name];
|
195 | } else {
|
196 | throw new Error('Unknown CSS variable ' + name);
|
197 | }
|
198 | },
|
199 | );
|
200 | file.contents = Buffer.from(replaced);
|
201 | callback(null, file);
|
202 | }),
|
203 | )
|
204 | .pipe(header(COPYRIGHT_HEADER, {version: packageData.version}))
|
205 | .pipe(gulp.dest(paths.dist))
|
206 | );
|
207 | }),
|
208 | );
|
209 |
|
210 | gulp.task(
|
211 | 'dist',
|
212 | gulp.series('modules', 'css', function() {
|
213 | var opts = {
|
214 | debug: true,
|
215 | output: 'Recoil.js',
|
216 | };
|
217 | return gulp
|
218 | .src('./lib/Recoil.js')
|
219 | .pipe(buildDist(opts))
|
220 | .pipe(derequire())
|
221 | .pipe(
|
222 | gulpif(
|
223 | '*.js',
|
224 | header(COPYRIGHT_HEADER, {version: packageData.version}),
|
225 | ),
|
226 | )
|
227 | .pipe(gulp.dest(paths.dist));
|
228 | }),
|
229 | );
|
230 |
|
231 | gulp.task(
|
232 | 'dist:min',
|
233 | gulp.series('modules', function() {
|
234 | var opts = {
|
235 | debug: false,
|
236 | output: 'Recoil.min.js',
|
237 | };
|
238 | return gulp
|
239 | .src('./lib/Recoil.js')
|
240 | .pipe(buildDist(opts))
|
241 | .pipe(
|
242 | gulpif(
|
243 | '*.js',
|
244 | header(COPYRIGHT_HEADER, {version: packageData.version}),
|
245 | ),
|
246 | )
|
247 | .pipe(gulp.dest(paths.dist));
|
248 | }),
|
249 | );
|
250 |
|
251 | gulp.task(
|
252 | 'check-dependencies',
|
253 | gulp.series(function() {
|
254 | return gulp.src('package.json').pipe(gulpCheckDependencies());
|
255 | }),
|
256 | );
|
257 |
|
258 | gulp.task(
|
259 | 'watch',
|
260 | gulp.series(function() {
|
261 | gulp.watch(paths.src, gulp.parallel('modules'));
|
262 | }),
|
263 | );
|
264 |
|
265 | gulp.task(
|
266 | 'dev',
|
267 | gulp.series(function() {
|
268 | gulp.watch(paths.src, gulp.parallel('dist'));
|
269 | }),
|
270 | );
|
271 |
|
272 | gulp.task(
|
273 | 'default',
|
274 | gulp.series(
|
275 | 'check-dependencies',
|
276 | 'clean',
|
277 | gulp.parallel('modules', 'flow'),
|
278 | gulp.parallel('dist', 'dist:min'),
|
279 | ),
|
280 | );
|