@modern-js/server 1.21.5 → 2.0.0-beta.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +79 -22
- package/dist/js/modern/dev-tools/dev-middleware/dev-server-plugin.js +4 -9
- package/dist/js/modern/dev-tools/dev-middleware/hmr-client/createSocketUrl.js +2 -5
- package/dist/js/modern/dev-tools/dev-middleware/hmr-client/index.js +43 -50
- package/dist/js/modern/dev-tools/dev-middleware/index.js +14 -32
- package/dist/js/modern/dev-tools/dev-middleware/socket-server.js +18 -43
- package/dist/js/modern/dev-tools/https/index.js +0 -2
- package/dist/js/modern/dev-tools/mock/getMockData.js +4 -23
- package/dist/js/modern/dev-tools/mock/index.js +0 -8
- package/dist/js/modern/dev-tools/register/index.js +9 -23
- package/dist/js/modern/dev-tools/watcher/dependency-tree.js +5 -15
- package/dist/js/modern/dev-tools/watcher/index.js +0 -18
- package/dist/js/modern/dev-tools/watcher/stats-cache.js +0 -16
- package/dist/js/modern/index.js +0 -1
- package/dist/js/modern/server/dev-server.js +37 -56
- package/dist/js/modern/server/index.js +0 -4
- package/dist/js/node/constants.js +0 -3
- package/dist/js/node/dev-tools/dev-middleware/dev-server-plugin.js +4 -11
- package/dist/js/node/dev-tools/dev-middleware/hmr-client/createSocketUrl.js +2 -8
- package/dist/js/node/dev-tools/dev-middleware/hmr-client/index.js +41 -53
- package/dist/js/node/dev-tools/dev-middleware/index.js +14 -38
- package/dist/js/node/dev-tools/dev-middleware/socket-server.js +18 -48
- package/dist/js/node/dev-tools/https/index.js +0 -7
- package/dist/js/node/dev-tools/mock/getMockData.js +4 -29
- package/dist/js/node/dev-tools/mock/index.js +0 -17
- package/dist/js/node/dev-tools/register/index.js +8 -31
- package/dist/js/node/dev-tools/watcher/dependency-tree.js +5 -19
- package/dist/js/node/dev-tools/watcher/index.js +0 -32
- package/dist/js/node/dev-tools/watcher/stats-cache.js +0 -23
- package/dist/js/node/index.js +0 -4
- package/dist/js/node/server/dev-server.js +37 -75
- package/dist/js/node/server/index.js +0 -7
- package/dist/types/dev-tools/mock/getMockData.d.ts +0 -2
- package/dist/types/dev-tools/watcher/dependency-tree.d.ts +0 -2
- package/dist/types/index.d.ts +0 -2
- package/package.json +11 -34
|
@@ -1,9 +1,6 @@
|
|
|
1
1
|
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
|
|
2
|
-
|
|
3
2
|
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
|
|
4
|
-
|
|
5
3
|
function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
|
|
6
|
-
|
|
7
4
|
import { createServer } from 'http';
|
|
8
5
|
import path from 'path';
|
|
9
6
|
import { createServer as createHttpsServer } from 'https';
|
|
@@ -17,20 +14,19 @@ import Watcher, { mergeWatchOptions } from "../dev-tools/watcher";
|
|
|
17
14
|
import DevMiddleware from "../dev-tools/dev-middleware";
|
|
18
15
|
export class ModernDevServer extends ModernServer {
|
|
19
16
|
constructor(options) {
|
|
20
|
-
super(options);
|
|
17
|
+
super(options);
|
|
21
18
|
|
|
19
|
+
// dev server should work in pwd
|
|
22
20
|
_defineProperty(this, "mockHandler", null);
|
|
23
|
-
|
|
24
21
|
_defineProperty(this, "dev", void 0);
|
|
25
|
-
|
|
26
22
|
_defineProperty(this, "devMiddleware", void 0);
|
|
27
|
-
|
|
28
23
|
_defineProperty(this, "watcher", void 0);
|
|
24
|
+
this.workDir = this.pwd;
|
|
29
25
|
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
this.dev = this.getDevOptions(options); // create dev middleware instance
|
|
26
|
+
// set dev server options, like webpack-dev-server
|
|
27
|
+
this.dev = this.getDevOptions(options);
|
|
33
28
|
|
|
29
|
+
// create dev middleware instance
|
|
34
30
|
this.devMiddleware = new DevMiddleware({
|
|
35
31
|
dev: this.dev,
|
|
36
32
|
compiler: options.compiler,
|
|
@@ -38,7 +34,6 @@ export class ModernDevServer extends ModernServer {
|
|
|
38
34
|
});
|
|
39
35
|
enableRegister(this.pwd, this.conf);
|
|
40
36
|
}
|
|
41
|
-
|
|
42
37
|
getDevOptions(options) {
|
|
43
38
|
const devOptions = typeof options.dev === 'boolean' ? {} : options.dev;
|
|
44
39
|
const defaultOptions = getDefaultDevOptions();
|
|
@@ -46,7 +41,6 @@ export class ModernDevServer extends ModernServer {
|
|
|
46
41
|
client: _objectSpread(_objectSpread({}, defaultOptions.client), devOptions === null || devOptions === void 0 ? void 0 : devOptions.client)
|
|
47
42
|
});
|
|
48
43
|
}
|
|
49
|
-
|
|
50
44
|
addMiddlewareHandler(handlers) {
|
|
51
45
|
handlers.forEach(handler => {
|
|
52
46
|
this.addHandler((ctx, next) => {
|
|
@@ -58,7 +52,6 @@ export class ModernDevServer extends ModernServer {
|
|
|
58
52
|
});
|
|
59
53
|
});
|
|
60
54
|
}
|
|
61
|
-
|
|
62
55
|
applySetupMiddlewares() {
|
|
63
56
|
const setupMiddlewares = this.dev.setupMiddlewares || [];
|
|
64
57
|
const serverOptions = {
|
|
@@ -76,38 +69,40 @@ export class ModernDevServer extends ModernServer {
|
|
|
76
69
|
befores,
|
|
77
70
|
afters
|
|
78
71
|
};
|
|
79
|
-
}
|
|
80
|
-
|
|
72
|
+
}
|
|
81
73
|
|
|
74
|
+
// Complete the preparation of services
|
|
82
75
|
async onInit(runner, app) {
|
|
83
76
|
this.runner = runner;
|
|
84
77
|
const {
|
|
85
78
|
dev
|
|
86
|
-
} = this;
|
|
79
|
+
} = this;
|
|
87
80
|
|
|
81
|
+
// Order: devServer.before => setupMiddlewares.unshift => internal middlewares => setupMiddlewares.push => devServer.after
|
|
88
82
|
const {
|
|
89
83
|
befores,
|
|
90
84
|
afters
|
|
91
|
-
} = this.applySetupMiddlewares();
|
|
85
|
+
} = this.applySetupMiddlewares();
|
|
92
86
|
|
|
87
|
+
// before dev handler
|
|
93
88
|
const beforeHandlers = await this.setupBeforeDevMiddleware();
|
|
94
89
|
this.addMiddlewareHandler([...beforeHandlers, ...befores]);
|
|
95
|
-
await this.applyDefaultMiddlewares(app);
|
|
90
|
+
await this.applyDefaultMiddlewares(app);
|
|
96
91
|
|
|
92
|
+
// after dev handler
|
|
97
93
|
const afterHandlers = await this.setupAfterDevMiddleware();
|
|
98
94
|
this.addMiddlewareHandler([...afters, ...afterHandlers]);
|
|
99
|
-
await super.onInit(runner, app);
|
|
95
|
+
await super.onInit(runner, app);
|
|
100
96
|
|
|
97
|
+
// watch mock/ server/ api/ dir file change
|
|
101
98
|
if (dev.watch) {
|
|
102
99
|
this.startWatcher();
|
|
103
100
|
app.on('close', async () => {
|
|
104
101
|
var _this$watcher;
|
|
105
|
-
|
|
106
102
|
await ((_this$watcher = this.watcher) === null || _this$watcher === void 0 ? void 0 : _this$watcher.close());
|
|
107
103
|
});
|
|
108
104
|
}
|
|
109
105
|
}
|
|
110
|
-
|
|
111
106
|
async applyDefaultMiddlewares(app) {
|
|
112
107
|
const {
|
|
113
108
|
pwd,
|
|
@@ -117,23 +112,21 @@ export class ModernDevServer extends ModernServer {
|
|
|
117
112
|
this.addHandler((ctx, next) => {
|
|
118
113
|
// allow hmr request cross-domain, because the user may use global proxy
|
|
119
114
|
ctx.res.setHeader('Access-Control-Allow-Origin', '*');
|
|
120
|
-
|
|
121
115
|
if (ctx.path.includes('hot-update')) {
|
|
122
116
|
ctx.res.setHeader('Access-Control-Allow-Credentials', 'false');
|
|
123
|
-
}
|
|
124
|
-
|
|
117
|
+
}
|
|
125
118
|
|
|
119
|
+
// 用户在 devServer 上配置的 headers 不会对 html 的请求生效,加入下面代码,使配置的 headers 对所有请求生效
|
|
126
120
|
const confHeaders = dev.headers;
|
|
127
|
-
|
|
128
121
|
if (confHeaders) {
|
|
129
122
|
for (const [key, value] of Object.entries(confHeaders)) {
|
|
130
123
|
ctx.res.setHeader(key, value);
|
|
131
124
|
}
|
|
132
125
|
}
|
|
133
|
-
|
|
134
126
|
next();
|
|
135
|
-
});
|
|
127
|
+
});
|
|
136
128
|
|
|
129
|
+
// mock handler
|
|
137
130
|
this.mockHandler = createMockHandler({
|
|
138
131
|
pwd
|
|
139
132
|
});
|
|
@@ -143,17 +136,17 @@ export class ModernDevServer extends ModernServer {
|
|
|
143
136
|
} else {
|
|
144
137
|
next();
|
|
145
138
|
}
|
|
146
|
-
});
|
|
139
|
+
});
|
|
147
140
|
|
|
141
|
+
// dev proxy handler, each proxy has own handler
|
|
148
142
|
const proxyHandlers = createProxyHandler(dev.proxy);
|
|
149
|
-
|
|
150
143
|
if (proxyHandlers) {
|
|
151
144
|
proxyHandlers.forEach(handler => {
|
|
152
145
|
this.addHandler(handler);
|
|
153
146
|
});
|
|
154
|
-
}
|
|
155
|
-
|
|
147
|
+
}
|
|
156
148
|
|
|
149
|
+
// do webpack build / plugin apply / socket server when pass compiler instance
|
|
157
150
|
devMiddleware.init(app);
|
|
158
151
|
devMiddleware.on('change', stats => {
|
|
159
152
|
// Reset only when client compile done
|
|
@@ -170,14 +163,12 @@ export class ModernDevServer extends ModernServer {
|
|
|
170
163
|
req,
|
|
171
164
|
res
|
|
172
165
|
} = ctx;
|
|
173
|
-
|
|
174
166
|
if (devMiddleware.middleware) {
|
|
175
167
|
devMiddleware.middleware(req, res, next);
|
|
176
168
|
} else {
|
|
177
169
|
next();
|
|
178
170
|
}
|
|
179
171
|
});
|
|
180
|
-
|
|
181
172
|
if (dev.historyApiFallback) {
|
|
182
173
|
const {
|
|
183
174
|
default: connectHistoryApiFallback
|
|
@@ -186,41 +177,37 @@ export class ModernDevServer extends ModernServer {
|
|
|
186
177
|
this.addHandler((ctx, next) => historyApiFallbackMiddleware(ctx.req, ctx.res, next));
|
|
187
178
|
}
|
|
188
179
|
}
|
|
189
|
-
|
|
190
180
|
onRepack(options = {}) {
|
|
191
181
|
// reset the routing management instance every times the service starts
|
|
192
182
|
if (Array.isArray(options.routes)) {
|
|
193
183
|
this.router.reset(this.filterRoutes(options.routes));
|
|
194
|
-
}
|
|
195
|
-
|
|
184
|
+
}
|
|
196
185
|
|
|
197
|
-
|
|
186
|
+
// clean ssr bundle cache
|
|
187
|
+
this.cleanSSRCache();
|
|
198
188
|
|
|
189
|
+
// reset static file
|
|
199
190
|
this.reader.updateFile();
|
|
200
191
|
super.onRepack(options);
|
|
201
192
|
}
|
|
202
|
-
|
|
203
193
|
async createHTTPServer(handler) {
|
|
204
194
|
const {
|
|
205
195
|
dev
|
|
206
196
|
} = this;
|
|
207
197
|
const devHttpsOption = typeof dev === 'object' && dev.https;
|
|
208
|
-
|
|
209
198
|
if (devHttpsOption) {
|
|
210
199
|
const {
|
|
211
200
|
genHttpsOptions
|
|
212
201
|
} = require("../dev-tools/https");
|
|
213
|
-
|
|
214
202
|
const httpsOptions = await genHttpsOptions(devHttpsOption);
|
|
215
203
|
return createHttpsServer(httpsOptions, handler);
|
|
216
204
|
} else {
|
|
217
205
|
return createServer(handler);
|
|
218
206
|
}
|
|
219
207
|
}
|
|
220
|
-
|
|
221
|
-
|
|
208
|
+
warmupSSRBundle() {
|
|
209
|
+
// not warmup ssr bundle on development
|
|
222
210
|
}
|
|
223
|
-
|
|
224
211
|
onServerChange({
|
|
225
212
|
filepath,
|
|
226
213
|
event
|
|
@@ -233,7 +220,6 @@ export class ModernDevServer extends ModernServer {
|
|
|
233
220
|
} = AGGRED_DIR;
|
|
234
221
|
const mockPath = path.normalize(path.join(pwd, mock));
|
|
235
222
|
this.runner.reset();
|
|
236
|
-
|
|
237
223
|
if (filepath.startsWith(mockPath)) {
|
|
238
224
|
this.mockHandler = createMockHandler({
|
|
239
225
|
pwd
|
|
@@ -243,11 +229,12 @@ export class ModernDevServer extends ModernServer {
|
|
|
243
229
|
const success = this.runner.onApiChange([{
|
|
244
230
|
filename: filepath,
|
|
245
231
|
event
|
|
246
|
-
}]);
|
|
232
|
+
}]);
|
|
233
|
+
|
|
234
|
+
// onApiChange 钩子被调用,且返回 true,则表示无需重新编译
|
|
247
235
|
// onApiChange 的类型是 WaterFall,WaterFall 钩子的返回值类型目前有问题
|
|
248
236
|
// eslint-disable-next-line @typescript-eslint/ban-ts-comment
|
|
249
237
|
// @ts-expect-error
|
|
250
|
-
|
|
251
238
|
if (success !== true) {
|
|
252
239
|
super.onServerChange({
|
|
253
240
|
filepath
|
|
@@ -258,13 +245,11 @@ export class ModernDevServer extends ModernServer {
|
|
|
258
245
|
}
|
|
259
246
|
}
|
|
260
247
|
}
|
|
261
|
-
|
|
262
248
|
createContext(req, res) {
|
|
263
249
|
return super.createContext(req, res, {
|
|
264
250
|
etag: true
|
|
265
251
|
});
|
|
266
252
|
}
|
|
267
|
-
|
|
268
253
|
async setupBeforeDevMiddleware() {
|
|
269
254
|
const {
|
|
270
255
|
runner,
|
|
@@ -275,7 +260,6 @@ export class ModernDevServer extends ModernServer {
|
|
|
275
260
|
const pluginMids = await runner.beforeDevServer(conf);
|
|
276
261
|
return [...setupMids, ...pluginMids].flat();
|
|
277
262
|
}
|
|
278
|
-
|
|
279
263
|
async setupAfterDevMiddleware() {
|
|
280
264
|
const {
|
|
281
265
|
runner,
|
|
@@ -286,7 +270,6 @@ export class ModernDevServer extends ModernServer {
|
|
|
286
270
|
const pluginMids = await runner.afterDevServer(conf);
|
|
287
271
|
return [...pluginMids, ...setupMids].flat();
|
|
288
272
|
}
|
|
289
|
-
|
|
290
273
|
cleanSSRCache() {
|
|
291
274
|
const {
|
|
292
275
|
distDir
|
|
@@ -294,19 +277,17 @@ export class ModernDevServer extends ModernServer {
|
|
|
294
277
|
const bundles = this.router.getBundles();
|
|
295
278
|
bundles.forEach(bundle => {
|
|
296
279
|
const filepath = path.join(distDir, bundle);
|
|
297
|
-
|
|
298
280
|
if (require.cache[filepath]) {
|
|
299
281
|
delete require.cache[filepath];
|
|
300
282
|
}
|
|
301
283
|
});
|
|
302
284
|
const loadable = path.join(distDir, LOADABLE_STATS_FILE);
|
|
303
|
-
|
|
304
285
|
if (require.cache[loadable]) {
|
|
305
286
|
delete require.cache[loadable];
|
|
306
287
|
}
|
|
307
288
|
}
|
|
308
|
-
|
|
309
289
|
startWatcher() {
|
|
290
|
+
var _this$conf$server;
|
|
310
291
|
const {
|
|
311
292
|
pwd
|
|
312
293
|
} = this;
|
|
@@ -314,11 +295,12 @@ export class ModernDevServer extends ModernServer {
|
|
|
314
295
|
mock
|
|
315
296
|
} = AGGRED_DIR;
|
|
316
297
|
const defaultWatched = [`${mock}/**/*`, `${SERVER_DIR}/**/*`, `${API_DIR}/**`, `${SHARED_DIR}/**/*`];
|
|
317
|
-
const watchOptions = mergeWatchOptions(this.conf.server.watchOptions);
|
|
298
|
+
const watchOptions = mergeWatchOptions((_this$conf$server = this.conf.server) === null || _this$conf$server === void 0 ? void 0 : _this$conf$server.watchOptions);
|
|
318
299
|
const defaultWatchedPaths = defaultWatched.map(p => path.normalize(path.join(pwd, p)));
|
|
319
300
|
const watcher = new Watcher();
|
|
320
|
-
watcher.createDepTree();
|
|
301
|
+
watcher.createDepTree();
|
|
321
302
|
|
|
303
|
+
// 监听文件变动,如果有变动则给 client,也就是 start 启动的插件发消息
|
|
322
304
|
watcher.listen(defaultWatchedPaths, watchOptions, (filepath, event) => {
|
|
323
305
|
watcher.updateDepTree();
|
|
324
306
|
watcher.cleanDepCache(filepath);
|
|
@@ -329,5 +311,4 @@ export class ModernDevServer extends ModernServer {
|
|
|
329
311
|
});
|
|
330
312
|
this.watcher = watcher;
|
|
331
313
|
}
|
|
332
|
-
|
|
333
314
|
}
|
|
@@ -1,17 +1,13 @@
|
|
|
1
1
|
import { Server } from '@modern-js/prod-server';
|
|
2
2
|
import { ModernDevServer } from "./dev-server";
|
|
3
|
-
|
|
4
3
|
const createDevServer = options => {
|
|
5
4
|
return new ModernDevServer(options);
|
|
6
5
|
};
|
|
7
|
-
|
|
8
6
|
export class DevServer extends Server {
|
|
9
7
|
constructor(options) {
|
|
10
8
|
super(options);
|
|
11
|
-
|
|
12
9
|
if (options.dev) {
|
|
13
10
|
this.serverImpl = createDevServer;
|
|
14
11
|
}
|
|
15
12
|
}
|
|
16
|
-
|
|
17
13
|
}
|
|
@@ -4,9 +4,7 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
4
4
|
value: true
|
|
5
5
|
});
|
|
6
6
|
exports.getDefaultDevOptions = void 0;
|
|
7
|
-
|
|
8
7
|
var _utils = require("@modern-js/utils");
|
|
9
|
-
|
|
10
8
|
const getDefaultDevOptions = () => {
|
|
11
9
|
const network = (0, _utils.getIpv4Interfaces)().find(item => !item.internal);
|
|
12
10
|
return {
|
|
@@ -24,5 +22,4 @@ const getDefaultDevOptions = () => {
|
|
|
24
22
|
liveReload: true
|
|
25
23
|
};
|
|
26
24
|
};
|
|
27
|
-
|
|
28
25
|
exports.getDefaultDevOptions = getDefaultDevOptions;
|
|
@@ -4,16 +4,12 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
4
4
|
value: true
|
|
5
5
|
});
|
|
6
6
|
exports.default = void 0;
|
|
7
|
-
|
|
8
7
|
function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
|
|
9
|
-
|
|
10
8
|
class DevServerPlugin {
|
|
11
9
|
constructor(options) {
|
|
12
10
|
_defineProperty(this, "options", void 0);
|
|
13
|
-
|
|
14
11
|
this.options = options;
|
|
15
12
|
}
|
|
16
|
-
|
|
17
13
|
injectHMRClient(compiler) {
|
|
18
14
|
const {
|
|
19
15
|
client
|
|
@@ -21,32 +17,29 @@ class DevServerPlugin {
|
|
|
21
17
|
const host = client !== null && client !== void 0 && client.host ? `&host=${client.host}` : '';
|
|
22
18
|
const path = client !== null && client !== void 0 && client.path ? `&path=${client.path}` : '';
|
|
23
19
|
const port = client !== null && client !== void 0 && client.port ? `&port=${client.port}` : '';
|
|
24
|
-
const clientEntry = `${require.resolve("./hmr-client")}?${host}${path}${port}`;
|
|
20
|
+
const clientEntry = `${require.resolve("./hmr-client")}?${host}${path}${port}`;
|
|
25
21
|
|
|
22
|
+
// use a hook to add entries if available
|
|
26
23
|
new compiler.webpack.EntryPlugin(compiler.context, clientEntry, {
|
|
27
24
|
name: undefined
|
|
28
25
|
}).apply(compiler);
|
|
29
26
|
}
|
|
30
|
-
|
|
31
27
|
apply(compiler) {
|
|
32
28
|
if (this.options.hot || this.options.liveReload) {
|
|
33
29
|
this.injectHMRClient(compiler);
|
|
34
|
-
}
|
|
35
|
-
|
|
30
|
+
}
|
|
36
31
|
|
|
32
|
+
// Todo remove, client must inject.
|
|
37
33
|
const compilerOptions = compiler.options;
|
|
38
34
|
const {
|
|
39
35
|
HotModuleReplacementPlugin
|
|
40
36
|
} = compiler.webpack;
|
|
41
37
|
compilerOptions.plugins = compilerOptions.plugins || [];
|
|
42
|
-
|
|
43
38
|
if (!compilerOptions.plugins.find(p => p.constructor === HotModuleReplacementPlugin)) {
|
|
44
39
|
// apply the HMR plugin, if it didn't exist before.
|
|
45
40
|
const plugin = new HotModuleReplacementPlugin();
|
|
46
41
|
plugin.apply(compiler);
|
|
47
42
|
}
|
|
48
43
|
}
|
|
49
|
-
|
|
50
44
|
}
|
|
51
|
-
|
|
52
45
|
exports.default = DevServerPlugin;
|
|
@@ -5,23 +5,18 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
5
5
|
});
|
|
6
6
|
exports.createSocketUrl = createSocketUrl;
|
|
7
7
|
exports.formatURL = formatURL;
|
|
8
|
-
|
|
9
8
|
var _constants = require("@modern-js/utils/constants");
|
|
10
|
-
|
|
11
9
|
function createSocketUrl(resourceQuery) {
|
|
12
10
|
// ?host=localhost&port=8080&path=modern_js_hmr_ws
|
|
13
11
|
const searchParams = resourceQuery.substr(1).split('&');
|
|
14
12
|
const options = {};
|
|
15
|
-
|
|
16
13
|
for (const pair of searchParams) {
|
|
17
14
|
const ary = pair.split('=');
|
|
18
15
|
options[ary[0]] = decodeURIComponent(ary[1]);
|
|
19
16
|
}
|
|
20
|
-
|
|
21
17
|
const currentLocation = self.location;
|
|
22
18
|
return getSocketUrl(options, currentLocation);
|
|
23
19
|
}
|
|
24
|
-
|
|
25
20
|
function formatURL({
|
|
26
21
|
port,
|
|
27
22
|
protocol,
|
|
@@ -36,13 +31,12 @@ function formatURL({
|
|
|
36
31
|
url.protocol = protocol;
|
|
37
32
|
url.pathname = pathname;
|
|
38
33
|
return url.toString();
|
|
39
|
-
}
|
|
40
|
-
|
|
34
|
+
}
|
|
41
35
|
|
|
36
|
+
// compatible with IE11
|
|
42
37
|
const colon = protocol.indexOf(':') === -1 ? ':' : '';
|
|
43
38
|
return `${protocol}${colon}//${hostname}:${port}${pathname}`;
|
|
44
39
|
}
|
|
45
|
-
|
|
46
40
|
function getSocketUrl(urlParts, location) {
|
|
47
41
|
const {
|
|
48
42
|
host,
|
|
@@ -1,19 +1,16 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
3
|
var _stripAnsi = _interopRequireDefault(require("@modern-js/utils/strip-ansi"));
|
|
4
|
-
|
|
5
4
|
var _format = require("@modern-js/utils/format");
|
|
6
|
-
|
|
7
5
|
var _createSocketUrl = require("./createSocketUrl");
|
|
8
|
-
|
|
9
6
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
10
|
-
|
|
11
7
|
/**
|
|
12
8
|
* This has been adapted from `create-react-app`, authored by Facebook, Inc.
|
|
13
9
|
* see: https://github.com/facebookincubator/create-react-app/tree/master/packages/react-dev-utils
|
|
14
10
|
*
|
|
15
11
|
* Tips: this package will be bundled and running in the browser, do not import from the entry of @modern-js/utils.
|
|
16
12
|
*/
|
|
13
|
+
|
|
17
14
|
// TODO hadRuntimeError should be fixed.
|
|
18
15
|
// We need to keep track of if there has been a runtime error.
|
|
19
16
|
// Essentially, we cannot guarantee application state was not corrupted by the
|
|
@@ -21,24 +18,25 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { de
|
|
|
21
18
|
// application. This is handled below when we are notified of a compile (code
|
|
22
19
|
// change).
|
|
23
20
|
// See https://github.com/facebook/create-react-app/issues/3096
|
|
24
|
-
const hadRuntimeError = false;
|
|
21
|
+
const hadRuntimeError = false;
|
|
25
22
|
|
|
23
|
+
// Connect to Dev Server
|
|
26
24
|
const socketUrl = (0, _createSocketUrl.createSocketUrl)(__resourceQuery);
|
|
27
|
-
const connection = new WebSocket(socketUrl);
|
|
25
|
+
const connection = new WebSocket(socketUrl);
|
|
26
|
+
|
|
27
|
+
// Unlike WebpackDevServer client, we won't try to reconnect
|
|
28
28
|
// to avoid spamming the console. Disconnect usually happens
|
|
29
29
|
// when developer stops the server.
|
|
30
|
-
|
|
31
30
|
connection.onclose = function () {
|
|
32
31
|
if (typeof console !== 'undefined' && typeof console.info === 'function') {
|
|
33
32
|
console.info('The development server has disconnected.\nRefresh the page if necessary.');
|
|
34
33
|
}
|
|
35
|
-
};
|
|
36
|
-
|
|
34
|
+
};
|
|
37
35
|
|
|
36
|
+
// Remember some state related to hot module replacement.
|
|
38
37
|
let isFirstCompilation = true;
|
|
39
38
|
let mostRecentCompilationHash = null;
|
|
40
39
|
let hasCompileErrors = false;
|
|
41
|
-
|
|
42
40
|
function clearOutdatedErrors() {
|
|
43
41
|
// Clean up outdated compile errors, if any.
|
|
44
42
|
// eslint-disable-next-line node/no-unsupported-features/node-builtins, no-console
|
|
@@ -48,154 +46,144 @@ function clearOutdatedErrors() {
|
|
|
48
46
|
console.clear();
|
|
49
47
|
}
|
|
50
48
|
}
|
|
51
|
-
}
|
|
52
|
-
|
|
49
|
+
}
|
|
53
50
|
|
|
51
|
+
// Successful compilation.
|
|
54
52
|
function handleSuccess() {
|
|
55
53
|
clearOutdatedErrors();
|
|
56
54
|
const isHotUpdate = !isFirstCompilation;
|
|
57
55
|
isFirstCompilation = false;
|
|
58
|
-
hasCompileErrors = false;
|
|
56
|
+
hasCompileErrors = false;
|
|
59
57
|
|
|
58
|
+
// Attempt to apply hot updates or reload.
|
|
60
59
|
if (isHotUpdate) {
|
|
61
60
|
tryApplyUpdates();
|
|
62
61
|
}
|
|
63
|
-
}
|
|
64
|
-
|
|
62
|
+
}
|
|
65
63
|
|
|
64
|
+
// Compilation with warnings (e.g. ESLint).
|
|
66
65
|
function handleWarnings(warnings) {
|
|
67
66
|
clearOutdatedErrors();
|
|
68
67
|
const isHotUpdate = !isFirstCompilation;
|
|
69
68
|
isFirstCompilation = false;
|
|
70
69
|
hasCompileErrors = false;
|
|
71
|
-
|
|
72
70
|
function printWarnings() {
|
|
73
71
|
// Print warnings to the console.
|
|
74
72
|
const formatted = (0, _format.formatWebpackMessages)({
|
|
75
73
|
warnings,
|
|
76
74
|
errors: []
|
|
77
75
|
});
|
|
78
|
-
|
|
79
76
|
if (typeof console !== 'undefined' && typeof console.warn === 'function') {
|
|
80
77
|
for (let i = 0; i < formatted.warnings.length; i++) {
|
|
81
78
|
if (i === 5) {
|
|
82
79
|
console.warn('There were more warnings in other files.\n' + 'You can find a complete log in the terminal.');
|
|
83
80
|
break;
|
|
84
81
|
}
|
|
85
|
-
|
|
86
82
|
console.warn((0, _stripAnsi.default)(formatted.warnings[i]));
|
|
87
83
|
}
|
|
88
84
|
}
|
|
89
85
|
}
|
|
86
|
+
printWarnings();
|
|
90
87
|
|
|
91
|
-
|
|
92
|
-
|
|
88
|
+
// Attempt to apply hot updates or reload.
|
|
93
89
|
if (isHotUpdate) {
|
|
94
90
|
tryApplyUpdates();
|
|
95
91
|
}
|
|
96
|
-
}
|
|
97
|
-
|
|
92
|
+
}
|
|
98
93
|
|
|
94
|
+
// Compilation with errors (e.g. syntax error or missing modules).
|
|
99
95
|
function handleErrors(errors) {
|
|
100
96
|
clearOutdatedErrors();
|
|
101
97
|
isFirstCompilation = false;
|
|
102
|
-
hasCompileErrors = true;
|
|
98
|
+
hasCompileErrors = true;
|
|
103
99
|
|
|
100
|
+
// "Massage" webpack messages.
|
|
104
101
|
const formatted = (0, _format.formatWebpackMessages)({
|
|
105
102
|
errors,
|
|
106
103
|
warnings: []
|
|
107
|
-
});
|
|
104
|
+
});
|
|
108
105
|
|
|
106
|
+
// Also log them to the console.
|
|
109
107
|
if (typeof console !== 'undefined' && typeof console.error === 'function') {
|
|
110
108
|
for (const error of formatted.errors) {
|
|
111
109
|
console.error((0, _stripAnsi.default)(error));
|
|
112
110
|
}
|
|
113
|
-
}
|
|
114
|
-
// We will reload on next success instead.
|
|
115
|
-
|
|
116
|
-
} // There is a newer version of the code available.
|
|
111
|
+
}
|
|
117
112
|
|
|
113
|
+
// Do not attempt to reload now.
|
|
114
|
+
// We will reload on next success instead.
|
|
115
|
+
}
|
|
118
116
|
|
|
117
|
+
// There is a newer version of the code available.
|
|
119
118
|
function handleAvailableHash(hash) {
|
|
120
119
|
// Update last known compilation hash.
|
|
121
120
|
mostRecentCompilationHash = hash;
|
|
122
|
-
}
|
|
123
|
-
|
|
121
|
+
}
|
|
124
122
|
|
|
123
|
+
// Handle messages from the server.
|
|
125
124
|
connection.onmessage = function (e) {
|
|
126
125
|
const message = JSON.parse(e.data);
|
|
127
|
-
|
|
128
126
|
switch (message.type) {
|
|
129
127
|
case 'hash':
|
|
130
128
|
handleAvailableHash(message.data);
|
|
131
129
|
break;
|
|
132
|
-
|
|
133
130
|
case 'still-ok':
|
|
134
131
|
case 'ok':
|
|
135
132
|
handleSuccess();
|
|
136
133
|
break;
|
|
137
|
-
|
|
138
134
|
case 'content-changed':
|
|
139
135
|
// Triggered when a file from `contentBase` changed.
|
|
140
136
|
window.location.reload();
|
|
141
137
|
break;
|
|
142
|
-
|
|
143
138
|
case 'warnings':
|
|
144
139
|
handleWarnings(message.data);
|
|
145
140
|
break;
|
|
146
|
-
|
|
147
141
|
case 'errors':
|
|
148
142
|
handleErrors(message.data);
|
|
149
143
|
break;
|
|
150
|
-
|
|
151
|
-
|
|
152
|
-
|
|
144
|
+
default:
|
|
145
|
+
// Do nothing.
|
|
153
146
|
}
|
|
154
|
-
};
|
|
155
|
-
|
|
147
|
+
};
|
|
156
148
|
|
|
149
|
+
// Is there a newer version of this code available?
|
|
157
150
|
function isUpdateAvailable() {
|
|
158
151
|
// __webpack_hash__ is the hash of the current compilation.
|
|
159
152
|
// It's a global variable injected by webpack.
|
|
160
153
|
return mostRecentCompilationHash !== __webpack_hash__;
|
|
161
|
-
}
|
|
162
|
-
|
|
154
|
+
}
|
|
163
155
|
|
|
156
|
+
// webpack disallows updates in other states.
|
|
164
157
|
function canApplyUpdates() {
|
|
165
158
|
return module.hot.status() === 'idle';
|
|
166
|
-
}
|
|
167
|
-
|
|
159
|
+
}
|
|
168
160
|
|
|
161
|
+
// Attempt to update code on the fly, fall back to a hard reload.
|
|
169
162
|
function tryApplyUpdates() {
|
|
170
163
|
if (!module.hot) {
|
|
171
164
|
// HotModuleReplacementPlugin is not in webpack configuration.
|
|
172
165
|
window.location.reload();
|
|
173
166
|
return;
|
|
174
167
|
}
|
|
175
|
-
|
|
176
168
|
if (!isUpdateAvailable() || !canApplyUpdates()) {
|
|
177
169
|
return;
|
|
178
170
|
}
|
|
179
|
-
|
|
180
171
|
function handleApplyUpdates(err, updatedModules) {
|
|
181
172
|
const wantsForcedReload = err || !updatedModules || hadRuntimeError;
|
|
182
|
-
|
|
183
173
|
if (wantsForcedReload) {
|
|
184
174
|
window.location.reload();
|
|
185
175
|
return;
|
|
186
176
|
}
|
|
187
|
-
|
|
188
177
|
if (isUpdateAvailable()) {
|
|
189
178
|
// While we were updating, there was a new update! Do it again.
|
|
190
179
|
tryApplyUpdates();
|
|
191
180
|
}
|
|
192
|
-
}
|
|
193
|
-
|
|
181
|
+
}
|
|
194
182
|
|
|
195
|
-
|
|
196
|
-
/* autoApply */
|
|
197
|
-
true, handleApplyUpdates); // // webpack 2 returns a Promise instead of invoking a callback
|
|
183
|
+
// https://webpack.github.io/docs/hot-module-replacement.html#check
|
|
184
|
+
const result = module.hot.check( /* autoApply */true, handleApplyUpdates);
|
|
198
185
|
|
|
186
|
+
// // webpack 2 returns a Promise instead of invoking a callback
|
|
199
187
|
if (result !== null && result !== void 0 && result.then) {
|
|
200
188
|
result.then(updatedModules => {
|
|
201
189
|
handleApplyUpdates(null, updatedModules);
|