|
| 1 | +import * as ts from "ts-morph"; |
| 2 | + |
| 3 | +/** |
| 4 | + * Gets the names of the variables that in the unminified webpack runtime file are called `installedChunks` and `installChunk`. |
| 5 | + * |
| 6 | + * Variables example: https://github.com/webpack/webpack/blob/dae16ad11e/examples/module-worker/README.md?plain=1#L256-L282 |
| 7 | + * |
| 8 | + * @param sourceFile the webpack runtime file parsed with ts-morph |
| 9 | + * @returns an object containing the two variable names |
| 10 | + */ |
| 11 | +export async function getChunkInstallationIdentifiers(sourceFile: ts.SourceFile): Promise<{ |
| 12 | + installedChunks: string; |
| 13 | + installChunk: string; |
| 14 | +}> { |
| 15 | + const installChunkDeclaration = getInstallChunkDeclaration(sourceFile); |
| 16 | + const installedChunksDeclaration = getInstalledChunksDeclaration(sourceFile, installChunkDeclaration); |
| 17 | + |
| 18 | + return { |
| 19 | + installChunk: installChunkDeclaration.getName(), |
| 20 | + installedChunks: installedChunksDeclaration.getName(), |
| 21 | + }; |
| 22 | +} |
| 23 | + |
| 24 | +/** |
| 25 | + * Gets the declaration for what in the unminified webpack runtime file is called `installChunk`(which is a function that registers the various chunks. |
| 26 | + * |
| 27 | + * `installChunk` example: https://github.com/webpack/webpack/blob/dae16ad11e/examples/module-worker/README.md?plain=1#L263-L282 |
| 28 | + * |
| 29 | + * @param sourceFile the webpack runtime file parsed with ts-morph |
| 30 | + * @returns the `installChunk` declaration |
| 31 | + */ |
| 32 | +function getInstallChunkDeclaration(sourceFile: ts.SourceFile): ts.VariableDeclaration { |
| 33 | + const installChunkDeclaration = sourceFile |
| 34 | + .getDescendantsOfKind(ts.SyntaxKind.VariableDeclaration) |
| 35 | + .find((declaration) => { |
| 36 | + const arrowFunction = declaration.getInitializerIfKind(ts.SyntaxKind.ArrowFunction); |
| 37 | + // we're looking for an arrow function |
| 38 | + if (!arrowFunction) return false; |
| 39 | + |
| 40 | + const functionParameters = arrowFunction.getParameters(); |
| 41 | + // the arrow function we're looking for has a single parameter (the chunkId) |
| 42 | + if (functionParameters.length !== 1) return false; |
| 43 | + |
| 44 | + const arrowFunctionBodyBlock = arrowFunction.getFirstChildByKind(ts.SyntaxKind.Block); |
| 45 | + |
| 46 | + // the arrow function we're looking for has a block body |
| 47 | + if (!arrowFunctionBodyBlock) return false; |
| 48 | + |
| 49 | + const statementKinds = arrowFunctionBodyBlock.getStatements().map((statement) => statement.getKind()); |
| 50 | + |
| 51 | + // the function we're looking for has 2 for loops (a standard one and a for-in one) |
| 52 | + const forInStatements = statementKinds.filter((s) => s === ts.SyntaxKind.ForInStatement); |
| 53 | + const forStatements = statementKinds.filter((s) => s === ts.SyntaxKind.ForStatement); |
| 54 | + if (forInStatements.length !== 1 || forStatements.length !== 1) return false; |
| 55 | + |
| 56 | + // the function we're looking for accesses its parameter three times, and it |
| 57 | + // accesses its `modules`, `ids` and `runtime` properties (in this order) |
| 58 | + const parameterName = functionParameters[0].getText(); |
| 59 | + const functionParameterAccessedProperties = arrowFunctionBodyBlock |
| 60 | + .getDescendantsOfKind(ts.SyntaxKind.PropertyAccessExpression) |
| 61 | + .filter( |
| 62 | + (propertyAccessExpression) => propertyAccessExpression.getExpression().getText() === parameterName |
| 63 | + ) |
| 64 | + .map((propertyAccessExpression) => propertyAccessExpression.getName()); |
| 65 | + if (functionParameterAccessedProperties.join(", ") !== "modules, ids, runtime") return false; |
| 66 | + |
| 67 | + return true; |
| 68 | + }); |
| 69 | + |
| 70 | + if (!installChunkDeclaration) { |
| 71 | + throw new Error("ERROR: unable to find the installChunk function declaration"); |
| 72 | + } |
| 73 | + |
| 74 | + return installChunkDeclaration; |
| 75 | +} |
| 76 | + |
| 77 | +/** |
| 78 | + * Gets the declaration for what in the unminified webpack runtime file is called `installedChunks` which is an object that holds the various registered chunks. |
| 79 | + * |
| 80 | + * `installedChunks` example: https://github.com/webpack/webpack/blob/dae16ad11e/examples/module-worker/README.md?plain=1#L256-L261 |
| 81 | + * |
| 82 | + * @param sourceFile the webpack runtime file parsed with ts-morph |
| 83 | + * @param installChunkDeclaration the declaration for the `installChunk` variable |
| 84 | + * @returns the `installedChunks` declaration |
| 85 | + */ |
| 86 | +function getInstalledChunksDeclaration( |
| 87 | + sourceFile: ts.SourceFile, |
| 88 | + installChunkDeclaration: ts.VariableDeclaration |
| 89 | +): ts.VariableDeclaration { |
| 90 | + const allVariableDeclarations = sourceFile.getDescendantsOfKind(ts.SyntaxKind.VariableDeclaration); |
| 91 | + const installChunkDeclarationIdx = allVariableDeclarations.findIndex( |
| 92 | + (declaration) => declaration === installChunkDeclaration |
| 93 | + ); |
| 94 | + |
| 95 | + // the installedChunks declaration comes right before the installChunk one |
| 96 | + const installedChunksDeclaration = allVariableDeclarations[installChunkDeclarationIdx - 1]; |
| 97 | + |
| 98 | + if (!installedChunksDeclaration?.getInitializer()?.isKind(ts.SyntaxKind.ObjectLiteralExpression)) { |
| 99 | + throw new Error("ERROR: unable to find the installedChunks declaration"); |
| 100 | + } |
| 101 | + return installedChunksDeclaration; |
| 102 | +} |
0 commit comments