Skip to content

Commit 5d2e706

Browse files
committed
fix: Make dependency portion webpack 5 specific
1 parent 8da9df4 commit 5d2e706

4 files changed

Lines changed: 99 additions & 85 deletions

File tree

package.json

Lines changed: 5 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -15,7 +15,11 @@
1515
"build": "tsc -p tsconfig.build.json",
1616
"start": "yarn build --watch",
1717
"lint": "eslint src --ext .ts,.js",
18-
"test": "jest",
18+
"test": "npm run test:v4 && npm run test:v5",
19+
"pretest:v4": "npm add @types/webpack ts-loader@8 webpack@4 --no-save",
20+
"test:v4": "jest",
21+
"pretest:v5": "npm add webpack@5 --no-save",
22+
"test:v5": "jest",
1923
"release": "auto shipit"
2024
},
2125
"keywords": [

src/dependency.ts

Lines changed: 12 additions & 18 deletions
Original file line numberDiff line numberDiff line change
@@ -1,17 +1,11 @@
11
/* eslint-disable max-classes-per-file */
2+
import * as webpack from "webpack";
3+
24
// eslint-disable-next-line
35
// @ts-ignore: What's the right way to refer to this one?
46
import makeSerializable from "webpack/lib/util/makeSerializable.js";
57

6-
// This import is compatible with both webpack 4 and 5
7-
// eslint-disable-next-line
8-
// @ts-ignore: Webpack 4 type
9-
import NullDependency from "webpack/lib/dependencies/NullDependency";
10-
11-
// It would be better to extend from webpack.dependencies but that works
12-
// only with webpack 5, not 4
13-
// class DocGenDependency extends webpack.dependencies.NullDependency
14-
class DocGenDependency extends NullDependency {
8+
class DocGenDependency extends webpack.dependencies.NullDependency {
159
public codeBlock: string;
1610

1711
constructor(codeBlock: string) {
@@ -20,9 +14,7 @@ class DocGenDependency extends NullDependency {
2014
this.codeBlock = codeBlock;
2115
}
2216

23-
updateHash: NullDependency["updateHash"] = (hash: {
24-
update: (str: string) => void;
25-
}) => {
17+
updateHash: webpack.dependencies.NullDependency["updateHash"] = (hash) => {
2618
hash.update(this.codeBlock);
2719
};
2820
}
@@ -32,14 +24,16 @@ makeSerializable(
3224
"react-docgen-typescript-plugin/dist/dependency"
3325
);
3426

35-
type NullDependencyTemplateType = InstanceType<typeof NullDependency.Template>;
36-
class DocGenTemplate extends NullDependency.Template
27+
type NullDependencyTemplateType = InstanceType<
28+
typeof webpack.dependencies.NullDependency.Template
29+
>;
30+
class DocGenTemplate extends webpack.dependencies.NullDependency.Template
3731
implements NullDependencyTemplateType {
3832
// eslint-disable-next-line
3933
// @ts-ignore: Webpack 4 type
4034
apply: NullDependencyTemplateType["apply"] = (
4135
dependency: DocGenDependency,
42-
source: { insert: (a: number, b: string) => void }
36+
source
4337
) => {
4438
if (dependency.codeBlock) {
4539
// Insert to the end
@@ -48,8 +42,8 @@ class DocGenTemplate extends NullDependency.Template
4842
};
4943
}
5044

51-
// eslint-disable-next-line
52-
// @ts-ignore: Webpack 4 type
5345
DocGenDependency.Template = DocGenTemplate;
5446

55-
export default DocGenDependency;
47+
// Default imports are tricky with CommonJS
48+
// eslint-disable-next-line
49+
export { DocGenDependency };

src/index.ts

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -13,6 +13,8 @@ try {
1313
require.resolve("typescript");
1414
plugin = require("./plugin").default;
1515
} catch (error) {
16+
console.error(error);
17+
1618
plugin = EmptyPlugin as any;
1719
}
1820

src/plugin.ts

Lines changed: 80 additions & 66 deletions
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,6 @@ import { matcher } from "micromatch";
66
import * as webpack from "webpack";
77

88
import { LoaderOptions } from "./types";
9-
import DocGenDependency from "./dependency";
109
import {
1110
generateDocgenCodeBlock,
1211
GeneratorOptions,
@@ -130,74 +129,89 @@ export default class DocgenPlugin implements webpack.WebpackPluginInstance {
130129
const webpackVersion = compiler.webpack.version;
131130
const isWebpack5 = parseInt(webpackVersion.split(".")[0], 10) >= 5;
132131

133-
compiler.hooks.compilation.tap(pluginName, (compilation) => {
134-
if (isWebpack5) {
135-
compilation.dependencyTemplates.set(
132+
compiler.hooks.compilation.tap(
133+
pluginName,
134+
(compilation: webpack.Compilation) => {
135+
if (isWebpack5) {
136+
// Since this file is needed only for webpack 5, load it only then
137+
// to simplify the implementation of the file.
138+
//
136139
// eslint-disable-next-line
137-
// @ts-ignore: Webpack 4 type
138-
DocGenDependency,
139-
// eslint-disable-next-line
140-
// @ts-ignore: Webpack 4 type
141-
new DocGenDependency.Template()
142-
);
143-
}
144-
145-
compilation.hooks.seal.tap(pluginName, () => {
146-
const modulesToProcess: [string, webpack.Module][] = [];
147-
148-
// 1. Aggregate modules to process
149-
compilation.modules.forEach((module: webpack.Module) => {
150-
const nameForCondition = module.nameForCondition() || "";
151-
152-
if (isExcluded(nameForCondition)) {
153-
debugExclude(
154-
`Module not matched in "exclude": ${nameForCondition}`
155-
);
156-
return;
157-
}
158-
159-
if (!isIncluded(nameForCondition)) {
160-
debugExclude(
161-
`Module not matched in "include": ${nameForCondition}`
162-
);
163-
return;
164-
}
165-
166-
modulesToProcess.push([nameForCondition, module]);
167-
});
168-
169-
// 2. Create a ts program with the modules
170-
const tsProgram = ts.createProgram(
171-
modulesToProcess.map(([name]) => name),
172-
compilerOptions
173-
);
174-
175-
// 3. Process and parse each module and add the type information
176-
// as a dependency
177-
modulesToProcess.forEach(([name, module]) => {
178-
if (isWebpack5) {
179-
module.addDependency(
140+
const { DocGenDependency } = require("./dependency");
141+
142+
compilation.dependencyTemplates.set(
143+
// eslint-disable-next-line
144+
// @ts-ignore: Webpack 4 type
145+
DocGenDependency,
146+
// eslint-disable-next-line
147+
// @ts-ignore: Webpack 4 type
148+
new DocGenDependency.Template()
149+
);
150+
}
151+
152+
compilation.hooks.seal.tap(pluginName, () => {
153+
const modulesToProcess: [string, webpack.Module][] = [];
154+
155+
// 1. Aggregate modules to process
156+
compilation.modules.forEach((module: webpack.Module) => {
157+
const nameForCondition = module.nameForCondition() || "";
158+
159+
if (isExcluded(nameForCondition)) {
160+
debugExclude(
161+
`Module not matched in "exclude": ${nameForCondition}`
162+
);
163+
return;
164+
}
165+
166+
if (!isIncluded(nameForCondition)) {
167+
debugExclude(
168+
`Module not matched in "include": ${nameForCondition}`
169+
);
170+
return;
171+
}
172+
173+
modulesToProcess.push([nameForCondition, module]);
174+
});
175+
176+
// 2. Create a ts program with the modules
177+
const tsProgram = ts.createProgram(
178+
modulesToProcess.map(([name]) => name),
179+
compilerOptions
180+
);
181+
182+
// 3. Process and parse each module and add the type information
183+
// as a dependency
184+
modulesToProcess.forEach(([name, module]) => {
185+
if (isWebpack5) {
186+
// Since this file is needed only for webpack 5, load it only then
187+
// to simplify the implementation of the file.
188+
//
180189
// eslint-disable-next-line
181-
// @ts-ignore: Webpack 4 type
182-
new DocGenDependency(
183-
generateDocgenCodeBlock({
184-
filename: name,
185-
source: name,
186-
componentDocs: docGenParser.parseWithProgramProvider(
187-
name,
188-
() => tsProgram
189-
),
190-
...generateOptions,
191-
})
192-
)
193-
);
194-
} else {
195-
// Assume webpack 4 or earlier
196-
processModule(docGenParser, module, tsProgram, generateOptions);
197-
}
190+
const { DocGenDependency } = require("./dependency");
191+
192+
module.addDependency(
193+
// eslint-disable-next-line
194+
// @ts-ignore: Webpack 4 type
195+
new DocGenDependency(
196+
generateDocgenCodeBlock({
197+
filename: name,
198+
source: name,
199+
componentDocs: docGenParser.parseWithProgramProvider(
200+
name,
201+
() => tsProgram
202+
),
203+
...generateOptions,
204+
})
205+
)
206+
);
207+
} else {
208+
// Assume webpack 4 or earlier
209+
processModule(docGenParser, module, tsProgram, generateOptions);
210+
}
211+
});
198212
});
199-
});
200-
});
213+
}
214+
);
201215
}
202216

203217
getOptions(): {

0 commit comments

Comments
 (0)