Skip to content

Commit 814632f

Browse files
liangchunnliangchunn
committed
feat(webpack5): add support for webpack5 alpha
1 parent fe2a35d commit 814632f

File tree

8 files changed

+252
-776
lines changed

8 files changed

+252
-776
lines changed

‎.travis.yml

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -9,6 +9,7 @@ install:
99
- yarn add $WEBPACK $TSLOADER $VUELOADER -D
1010
- yarn lint
1111
env:
12+
- WEBPACK=webpack@^5.0.0 TSLOADER=ts-loader@^5.0.0 VUELOADER=vue-loader@^15.2.4
1213
- WEBPACK=webpack@^4.0.0 TSLOADER=ts-loader@^5.0.0 VUELOADER=vue-loader@^15.2.4
1314
- WEBPACK=webpack@^3.10.0 TSLOADER=ts-loader@^3.4.0 VUELOADER=vue-loader@^13.5.0
1415
- WEBPACK=webpack@^2.7.0 TSLOADER=ts-loader@^3.4.0 VUELOADER=vue-loader@^13.5.0

‎README.md

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -250,5 +250,14 @@ import Hello from '@/components/hello.vue'
250250

251251
7. If you are working in **VSCode**, you can get extensions [Vetur](https://marketplace.visualstudio.com/items?itemName=octref.vetur) and [TSLint Vue](https://marketplace.visualstudio.com/items?itemName=prograhammer.tslint-vue) to complete the developer workflow.
252252

253+
## Migration
254+
### From `0.5.x` to `0.6.x`
255+
Version `0.6.x` additionally supports webpack 5 alongside webpack 4, whose hooks are now tapped differently:
256+
```diff
257+
- compiler.hooks.forkTsCheckerDone.tap(...args)
258+
+ const hooks = ForkTsCheckerWebpackPlugin.getCompilerHooks(compiler)
259+
+ hooks.forkTsCheckerDone.tap(...args)
260+
```
261+
253262
## License
254263
MIT

‎package.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -75,7 +75,7 @@
7575
"vue-class-component": "^6.1.1",
7676
"vue-loader": "^15.2.4",
7777
"vue-template-compiler": "^2.5.16",
78-
"webpack": "^4.16.5"
78+
"webpack": "^5.0.0-alpha.0"
7979
},
8080
"peerDependencies": {
8181
"tslint": "^4.0.0 || ^5.0.0",

‎src/hooks.ts

Lines changed: 51 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,51 @@
1+
import * as webpack from 'webpack';
2+
import { AsyncSeriesHook, SyncHook } from 'tapable';
3+
4+
const compilerHookMap = new WeakMap();
5+
6+
export const customHooks = {
7+
forkTsCheckerServiceBeforeStart: 'fork-ts-checker-service-before-start',
8+
forkTsCheckerCancel: 'fork-ts-checker-cancel',
9+
forkTsCheckerServiceStartError: 'fork-ts-checker-service-start-error',
10+
forkTsCheckerWaiting: 'fork-ts-checker-waiting',
11+
forkTsCheckerServiceStart: 'fork-ts-checker-service-start',
12+
forkTsCheckerReceive: 'fork-ts-checker-receive',
13+
forkTsCheckerServiceOutOfMemory: 'fork-ts-checker-service-out-of-memory',
14+
forkTsCheckerEmit: 'fork-ts-checker-emit',
15+
forkTsCheckerDone: 'fork-ts-checker-done'
16+
};
17+
18+
function createForkTsCheckerWebpackPluginHooks(): Record<
19+
keyof typeof customHooks,
20+
SyncHook | AsyncSeriesHook
21+
> {
22+
return {
23+
forkTsCheckerServiceBeforeStart: new AsyncSeriesHook([]),
24+
forkTsCheckerCancel: new SyncHook(['cancellationToken']),
25+
forkTsCheckerServiceStartError: new SyncHook(['error']),
26+
forkTsCheckerWaiting: new SyncHook(['hasTsLint']),
27+
forkTsCheckerServiceStart: new SyncHook([
28+
'tsconfigPath',
29+
'tslintPath',
30+
'watchPaths',
31+
'workersNumber',
32+
'memoryLimit'
33+
]),
34+
forkTsCheckerReceive: new SyncHook(['diagnostics', 'lints']),
35+
forkTsCheckerServiceOutOfMemory: new SyncHook([]),
36+
forkTsCheckerEmit: new SyncHook(['diagnostics', 'lints', 'elapsed']),
37+
forkTsCheckerDone: new SyncHook(['diagnostics', 'lints', 'elapsed'])
38+
};
39+
}
40+
41+
export function getForkTsCheckerWebpackPluginHooks(compiler: webpack.Compiler) {
42+
let hooks: Record<
43+
keyof typeof customHooks,
44+
SyncHook | AsyncSeriesHook
45+
> = compilerHookMap.get(compiler);
46+
if (hooks === undefined) {
47+
hooks = createForkTsCheckerWebpackPluginHooks();
48+
compilerHookMap.set(compiler, hooks);
49+
}
50+
return hooks;
51+
}

‎src/index.ts

Lines changed: 35 additions & 118 deletions
Original file line numberDiff line numberDiff line change
@@ -12,22 +12,10 @@ import { createCodeframeFormatter } from './formatter/codeframeFormatter';
1212
import { FsHelper } from './FsHelper';
1313
import { Message } from './Message';
1414

15-
import { AsyncSeriesHook, SyncHook } from 'tapable';
15+
import { getForkTsCheckerWebpackPluginHooks } from './hooks';
1616

1717
const checkerPluginName = 'fork-ts-checker-webpack-plugin';
1818

19-
const customHooks = {
20-
forkTsCheckerServiceBeforeStart: 'fork-ts-checker-service-before-start',
21-
forkTsCheckerCancel: 'fork-ts-checker-cancel',
22-
forkTsCheckerServiceStartError: 'fork-ts-checker-service-start-error',
23-
forkTsCheckerWaiting: 'fork-ts-checker-waiting',
24-
forkTsCheckerServiceStart: 'fork-ts-checker-service-start',
25-
forkTsCheckerReceive: 'fork-ts-checker-receive',
26-
forkTsCheckerServiceOutOfMemory: 'fork-ts-checker-service-out-of-memory',
27-
forkTsCheckerEmit: 'fork-ts-checker-emit',
28-
forkTsCheckerDone: 'fork-ts-checker-done'
29-
};
30-
3119
type Formatter = (message: NormalizedMessage, useColors: boolean) => string;
3220

3321
interface Logger {
@@ -183,6 +171,10 @@ class ForkTsCheckerWebpackPlugin {
183171
this.vue = options.vue === true; // default false
184172
}
185173

174+
private static getCompilerHooks(compiler: webpack.Compiler) {
175+
return getForkTsCheckerWebpackPluginHooks(compiler);
176+
}
177+
186178
private static createFormatter(type: 'default' | 'codeframe', options: any) {
187179
switch (type) {
188180
case 'default':
@@ -219,9 +211,6 @@ class ForkTsCheckerWebpackPlugin {
219211
}
220212

221213
if (tsconfigOk && tslintOk) {
222-
if ('hooks' in compiler) {
223-
this.registerCustomHooks();
224-
}
225214
this.pluginStart();
226215
this.pluginStop();
227216
this.pluginCompile();
@@ -275,7 +264,7 @@ class ForkTsCheckerWebpackPlugin {
275264
};
276265

277266
if ('hooks' in this.compiler) {
278-
// webpack 4
267+
// webpack 4+
279268
this.compiler.hooks.run.tapAsync(checkerPluginName, run);
280269
this.compiler.hooks.watchRun.tapAsync(checkerPluginName, watchRun);
281270
} else {
@@ -297,7 +286,7 @@ class ForkTsCheckerWebpackPlugin {
297286
};
298287

299288
if ('hooks' in this.compiler) {
300-
// webpack 4
289+
// webpack 4+
301290
this.compiler.hooks.watchClose.tap(checkerPluginName, watchClose);
302291
this.compiler.hooks.done.tap(checkerPluginName, done);
303292
} else {
@@ -311,88 +300,17 @@ class ForkTsCheckerWebpackPlugin {
311300
});
312301
}
313302

314-
private registerCustomHooks() {
315-
if (
316-
this.compiler.hooks.forkTsCheckerServiceBeforeStart ||
317-
this.compiler.hooks.forkTsCheckerCancel ||
318-
this.compiler.hooks.forkTsCheckerServiceStartError ||
319-
this.compiler.hooks.forkTsCheckerWaiting ||
320-
this.compiler.hooks.forkTsCheckerServiceStart ||
321-
this.compiler.hooks.forkTsCheckerReceive ||
322-
this.compiler.hooks.forkTsCheckerServiceOutOfMemory ||
323-
this.compiler.hooks.forkTsCheckerDone ||
324-
this.compiler.hooks.forkTsCheckerEmit
325-
) {
326-
throw new Error(
327-
'fork-ts-checker-webpack-plugin hooks are already in use'
328-
);
329-
}
330-
this.compiler.hooks.forkTsCheckerServiceBeforeStart = new AsyncSeriesHook(
331-
[]
332-
);
333-
334-
this.compiler.hooks.forkTsCheckerCancel = new SyncHook([
335-
'cancellationToken'
336-
]);
337-
this.compiler.hooks.forkTsCheckerServiceStartError = new SyncHook([
338-
'error'
339-
]);
340-
this.compiler.hooks.forkTsCheckerWaiting = new SyncHook(['hasTsLint']);
341-
this.compiler.hooks.forkTsCheckerServiceStart = new SyncHook([
342-
'tsconfigPath',
343-
'tslintPath',
344-
'watchPaths',
345-
'workersNumber',
346-
'memoryLimit'
347-
]);
348-
this.compiler.hooks.forkTsCheckerReceive = new SyncHook([
349-
'diagnostics',
350-
'lints'
351-
]);
352-
this.compiler.hooks.forkTsCheckerServiceOutOfMemory = new SyncHook([]);
353-
this.compiler.hooks.forkTsCheckerEmit = new SyncHook([
354-
'diagnostics',
355-
'lints',
356-
'elapsed'
357-
]);
358-
this.compiler.hooks.forkTsCheckerDone = new SyncHook([
359-
'diagnostics',
360-
'lints',
361-
'elapsed'
362-
]);
363-
364-
// for backwards compatibility
365-
this.compiler._pluginCompat.tap(checkerPluginName, (options: any) => {
366-
switch (options.name) {
367-
case customHooks.forkTsCheckerServiceBeforeStart:
368-
options.async = true;
369-
break;
370-
case customHooks.forkTsCheckerCancel:
371-
case customHooks.forkTsCheckerServiceStartError:
372-
case customHooks.forkTsCheckerWaiting:
373-
case customHooks.forkTsCheckerServiceStart:
374-
case customHooks.forkTsCheckerReceive:
375-
case customHooks.forkTsCheckerServiceOutOfMemory:
376-
case customHooks.forkTsCheckerEmit:
377-
case customHooks.forkTsCheckerDone:
378-
return true;
379-
}
380-
return undefined;
381-
});
382-
}
383-
384303
private pluginCompile() {
385304
if ('hooks' in this.compiler) {
386-
// webpack 4
305+
// webpack 4+
306+
const hooks = ForkTsCheckerWebpackPlugin.getCompilerHooks(this.compiler);
387307
this.compiler.hooks.compile.tap(checkerPluginName, () => {
388308
this.compilationDone = false;
389-
this.compiler.hooks.forkTsCheckerServiceBeforeStart.callAsync(() => {
309+
hooks.forkTsCheckerServiceBeforeStart.callAsync(() => {
390310
if (this.cancellationToken) {
391311
// request cancellation if there is not finished job
392312
this.cancellationToken.requestCancellation();
393-
this.compiler.hooks.forkTsCheckerCancel.call(
394-
this.cancellationToken
395-
);
313+
hooks.forkTsCheckerCancel.call(this.cancellationToken);
396314
}
397315
this.checkDone = false;
398316

@@ -416,7 +334,7 @@ class ForkTsCheckerWebpackPlugin {
416334
);
417335
}
418336

419-
this.compiler.hooks.forkTsCheckerServiceStartError.call(error);
337+
hooks.forkTsCheckerServiceStartError.call(error);
420338
}
421339
});
422340
});
@@ -488,7 +406,7 @@ class ForkTsCheckerWebpackPlugin {
488406
};
489407

490408
if ('hooks' in this.compiler) {
491-
// webpack 4
409+
// webpack 4+
492410
this.compiler.hooks.emit.tapAsync(checkerPluginName, emit);
493411
} else {
494412
// webpack 2 / 3
@@ -498,7 +416,8 @@ class ForkTsCheckerWebpackPlugin {
498416

499417
private pluginDone() {
500418
if ('hooks' in this.compiler) {
501-
// webpack 4
419+
// webpack 4+
420+
const hooks = ForkTsCheckerWebpackPlugin.getCompilerHooks(this.compiler);
502421
this.compiler.hooks.done.tap(
503422
checkerPluginName,
504423
(_stats: webpack.Stats) => {
@@ -510,9 +429,7 @@ class ForkTsCheckerWebpackPlugin {
510429
this.doneCallback();
511430
} else {
512431
if (this.compiler) {
513-
this.compiler.hooks.forkTsCheckerWaiting.call(
514-
this.tslint !== false
515-
);
432+
hooks.forkTsCheckerWaiting.call(this.tslint !== false);
516433
}
517434
if (!this.silent && this.logger) {
518435
this.logger.info(
@@ -584,8 +501,9 @@ class ForkTsCheckerWebpackPlugin {
584501
);
585502

586503
if ('hooks' in this.compiler) {
587-
// webpack 4
588-
this.compiler.hooks.forkTsCheckerServiceStart.call(
504+
// webpack 4+
505+
const hooks = ForkTsCheckerWebpackPlugin.getCompilerHooks(this.compiler);
506+
hooks.forkTsCheckerServiceStart.call(
589507
this.tsconfigPath,
590508
this.tslintPath,
591509
this.watchPaths,
@@ -707,11 +625,9 @@ class ForkTsCheckerWebpackPlugin {
707625
}
708626

709627
if ('hooks' in this.compiler) {
710-
// webpack 4
711-
this.compiler.hooks.forkTsCheckerReceive.call(
712-
this.diagnostics,
713-
this.lints
714-
);
628+
// webpack 4+
629+
const hooks = ForkTsCheckerWebpackPlugin.getCompilerHooks(this.compiler);
630+
hooks.forkTsCheckerReceive.call(this.diagnostics, this.lints);
715631
} else {
716632
// webpack 2 / 3
717633
this.compiler.applyPlugins(
@@ -733,8 +649,11 @@ class ForkTsCheckerWebpackPlugin {
733649
// probably out of memory :/
734650
if (this.compiler) {
735651
if ('hooks' in this.compiler) {
736-
// webpack 4
737-
this.compiler.hooks.forkTsCheckerServiceOutOfMemory.call();
652+
// webpack 4+
653+
const hooks = ForkTsCheckerWebpackPlugin.getCompilerHooks(
654+
this.compiler
655+
);
656+
hooks.forkTsCheckerServiceOutOfMemory.call();
738657
} else {
739658
// webpack 2 / 3
740659
this.compiler.applyPlugins('fork-ts-checker-service-out-of-memory');
@@ -761,12 +680,11 @@ class ForkTsCheckerWebpackPlugin {
761680
const elapsed = Math.round(this.elapsed[0] * 1e9 + this.elapsed[1]);
762681

763682
if ('hooks' in this.compiler) {
764-
// webpack 4
765-
this.compiler.hooks.forkTsCheckerEmit.call(
766-
this.diagnostics,
767-
this.lints,
768-
elapsed
683+
// webpack 4+
684+
const hooks = ForkTsCheckerWebpackPlugin.getCompilerHooks(
685+
this.compiler
769686
);
687+
hooks.forkTsCheckerEmit.call(this.diagnostics, this.lints, elapsed);
770688
} else {
771689
// webpack 2 / 3
772690
this.compiler.applyPlugins(
@@ -819,12 +737,11 @@ class ForkTsCheckerWebpackPlugin {
819737

820738
if (this.compiler) {
821739
if ('hooks' in this.compiler) {
822-
// webpack 4
823-
this.compiler.hooks.forkTsCheckerDone.call(
824-
this.diagnostics,
825-
this.lints,
826-
elapsed
740+
// webpack 4+
741+
const hooks = ForkTsCheckerWebpackPlugin.getCompilerHooks(
742+
this.compiler
827743
);
744+
hooks.forkTsCheckerDone.call(this.diagnostics, this.lints, elapsed);
828745
} else {
829746
// webpack 2 / 3
830747
this.compiler.applyPlugins(

0 commit comments

Comments
 (0)