Skip to content

Commit 7dc4430

Browse files
easy1090easy1090
authored
fix(core): no parsed/gziped size on 'Bundle Analyzer Graph' page error. (#189)
1 parent 35a7ddb commit 7dc4430

File tree

3 files changed

+102
-104
lines changed

3 files changed

+102
-104
lines changed

‎.changeset/eleven-tomatoes-taste.md

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
---
2+
'@rsdoctor/core': patch
3+
---
4+
5+
fix: no parsed/gziped size on 'Bundle Analyzer Graph' page error.

‎packages/core/src/build-utils/build/chunks/generateTileGraph.ts

Lines changed: 4 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,7 @@
11
import { Plugin } from '@rsdoctor/types';
22
import path from 'path';
3-
import fs from 'fs';
4-
import { debug } from '@rsdoctor/utils/logger';
3+
import { debug, logger } from '@rsdoctor/utils/logger';
54
import { generateReport } from 'webpack-bundle-analyzer/lib/viewer';
6-
import { RsdoctorOutputFolder } from '@rsdoctor/types/dist/constants';
75

86
export const TileGraphReportName = 'rsdoctor-tile-graph.html';
97

@@ -23,7 +21,7 @@ async function generateJSONReportUtil(
2321
warn: () => {},
2422
info: () => {},
2523
error: (e: any) => {
26-
console.log(e);
24+
logger.info(`webpack-bundle-analyzer generateReport has error ${e}`);
2725
},
2826
},
2927
});
@@ -35,18 +33,14 @@ export async function generateTileGraph(
3533
buildOutputPath: string,
3634
) {
3735
try {
38-
const tileReportHtmlDir = path.join(buildOutputPath, RsdoctorOutputFolder);
39-
if (!fs.existsSync(tileReportHtmlDir)) {
40-
fs.mkdirSync(tileReportHtmlDir);
41-
}
4236
const { reportFilename } = opts;
4337
await generateJSONReportUtil(bundleStats, {
4438
...opts,
4539
openBrowser: false,
46-
bundleDir: tileReportHtmlDir,
40+
bundleDir: buildOutputPath,
4741
});
4842

49-
return path.join(tileReportHtmlDir, `${reportFilename}`);
43+
return path.join(buildOutputPath, `${reportFilename}`);
5044
} catch (e) {
5145
debug(() => `Generate webpack-bundle-analyzer tile graph has error:${e}`);
5246
return null;

‎packages/core/src/inner-plugins/plugins/ensureModulesChunkGraph.ts

Lines changed: 93 additions & 94 deletions
Original file line numberDiff line numberDiff line change
@@ -1,114 +1,113 @@
1-
2-
import { Linter, Plugin } from '@rsdoctor/types';
3-
import { debug } from '@rsdoctor/utils/logger';
1+
import path from 'path';
2+
import { RsdoctorPluginInstance } from '@/types';
3+
import { ModuleGraph } from '@rsdoctor/graph';
4+
import { Linter, Plugin, Constants } from '@rsdoctor/types';
45
import { Process } from '@rsdoctor/utils/build';
6+
import { debug } from '@rsdoctor/utils/logger';
7+
import fse from 'fs-extra';
58
import {
69
Chunks as ChunksBuildUtils,
710
ModuleGraph as ModuleGraphBuildUtils,
811
} from '../../build-utils/build';
9-
import {
10-
Chunks as ChunksUtils,
11-
} from '../../build-utils/common';
12-
import fse from 'fs-extra';
12+
import { Chunks as ChunksUtils } from '../../build-utils/common';
1313
import { internalPluginTapPreOptions } from '../constants';
14-
import { RsdoctorPluginInstance } from '@/types';
15-
import { ModuleGraph } from '@rsdoctor/graph';
1614

17-
/**
18-
* @description Generate ModuleGraph and ChunkGraph from stats and webpack module apis;
19-
* @param {Compiler} compiler
20-
* @return {*}
21-
* @memberof RsdoctorWebpackPlugin
22-
*/
23-
export const ensureModulesChunksGraphFn = (compiler: Plugin.BaseCompiler, _this: RsdoctorPluginInstance<Plugin.BaseCompiler, Linter.ExtendRuleData[]>) => {
24-
if (_this._modulesGraphApplied) return;
25-
_this._modulesGraphApplied = true;
15+
/**
16+
* @description Generate ModuleGraph and ChunkGraph from stats and webpack module apis;
17+
* @param {Compiler} compiler
18+
* @return {*}
19+
* @memberof RsdoctorWebpackPlugin
20+
*/
21+
export const ensureModulesChunksGraphFn = (
22+
compiler: Plugin.BaseCompiler,
23+
_this: RsdoctorPluginInstance<Plugin.BaseCompiler, Linter.ExtendRuleData[]>,
24+
) => {
25+
if (_this._modulesGraphApplied) return;
26+
_this._modulesGraphApplied = true;
2627

27-
const context: Required<ModuleGraphBuildUtils.TransformContext> = {
28-
astCache: new Map(),
29-
packagePathMap: new Map(),
30-
getSourceMap: (file: string) => {
31-
return _this.sdk.getSourceMap(file);
32-
},
33-
};
28+
const context: Required<ModuleGraphBuildUtils.TransformContext> = {
29+
astCache: new Map(),
30+
packagePathMap: new Map(),
31+
getSourceMap: (file: string) => {
32+
return _this.sdk.getSourceMap(file);
33+
},
34+
};
3435

35-
compiler.hooks.done.tapPromise(
36-
internalPluginTapPreOptions('moduleGraph'),
37-
async (_stats) => {
38-
const stats = _stats as Plugin.Stats;
39-
const statsJson = stats.toJson();
36+
compiler.hooks.done.tapPromise(
37+
internalPluginTapPreOptions('moduleGraph'),
38+
async (_stats) => {
39+
const stats = _stats as Plugin.Stats;
40+
const statsJson = stats.toJson();
4041

41-
debug(Process.getMemoryUsageMessage, '[Before Generate ModuleGraph]');
42+
debug(Process.getMemoryUsageMessage, '[Before Generate ModuleGraph]');
4243

43-
_this.chunkGraph = ChunksBuildUtils.chunkTransform(new Map(), statsJson);
44+
_this.chunkGraph = ChunksBuildUtils.chunkTransform(new Map(), statsJson);
4445

45-
/** generate module graph */
46-
_this.modulesGraph = await ModuleGraphBuildUtils.getModuleGraphByStats(
47-
stats.compilation,
48-
statsJson,
49-
process.cwd(),
50-
_this.chunkGraph,
51-
_this.options.features,
52-
context,
53-
);
46+
/** generate module graph */
47+
_this.modulesGraph = await ModuleGraphBuildUtils.getModuleGraphByStats(
48+
stats.compilation,
49+
statsJson,
50+
process.cwd(),
51+
_this.chunkGraph,
52+
_this.options.features,
53+
context,
54+
);
5455

55-
debug(Process.getMemoryUsageMessage, '[After Generate ModuleGraph]');
56+
debug(Process.getMemoryUsageMessage, '[After Generate ModuleGraph]');
5657

58+
/** transform modules graph */
59+
await getModulesInfosByStats(compiler, statsJson, _this.modulesGraph);
5760

58-
/** transform modules graph */
59-
await getModulesInfosByStats(
60-
compiler,
61-
statsJson,
62-
_this.modulesGraph,
63-
);
61+
debug(Process.getMemoryUsageMessage, '[After Transform ModuleGraph]');
6462

65-
debug(Process.getMemoryUsageMessage, '[After Transform ModuleGraph]');
63+
_this.modulesGraph &&
64+
(await _this.sdk.reportModuleGraph(_this.modulesGraph));
65+
await _this.sdk.reportChunkGraph(_this.chunkGraph);
6666

67-
_this.modulesGraph &&
68-
(await _this.sdk.reportModuleGraph(_this.modulesGraph));
69-
await _this.sdk.reportChunkGraph(_this.chunkGraph);
67+
/** Generate webpack-bundle-analyzer tile graph */
68+
const reportFilePath = await ChunksBuildUtils.generateTileGraph(
69+
statsJson as Plugin.BaseStats,
70+
{
71+
reportFilename: path.join(
72+
Constants.RsdoctorOutputFolder,
73+
ChunksBuildUtils.TileGraphReportName,
74+
),
75+
reportTitle: 'bundle-analyzer',
76+
},
77+
compiler.outputPath,
78+
);
7079

71-
/** Generate webpack-bundle-analyzer tile graph */
72-
const reportFilePath = await ChunksBuildUtils.generateTileGraph(
73-
statsJson as Plugin.BaseStats,
74-
{
75-
reportFilename: ChunksBuildUtils.TileGraphReportName,
76-
reportTitle: 'bundle-analyzer',
77-
},
78-
compiler.outputPath,
79-
);
80+
reportFilePath &&
81+
(await _this.sdk.reportTileHtml(
82+
fse.readFileSync(reportFilePath, 'utf-8'),
83+
));
84+
},
85+
);
86+
};
8087

81-
reportFilePath &&
82-
(await _this.sdk.reportTileHtml(
83-
fse.readFileSync(reportFilePath, 'utf-8'),
84-
));
85-
},
86-
);
88+
/**
89+
* @protected
90+
* @description This function to get module parsed code and size;
91+
* @param {Compiler} compiler
92+
* @param {StatsCompilation} stats
93+
* @param {ModuleGraph} moduleGraph
94+
* @return {*}
95+
* @memberof RsdoctorWebpackPlugin
96+
*/
97+
async function getModulesInfosByStats(
98+
compiler: Plugin.BaseCompiler,
99+
stats: Plugin.StatsCompilation,
100+
moduleGraph: ModuleGraph,
101+
) {
102+
if (!moduleGraph) {
103+
return;
87104
}
88-
89-
/**
90-
* @protected
91-
* @description This function to get module parsed code and size;
92-
* @param {Compiler} compiler
93-
* @param {StatsCompilation} stats
94-
* @param {ModuleGraph} moduleGraph
95-
* @return {*}
96-
* @memberof RsdoctorWebpackPlugin
97-
*/
98-
async function getModulesInfosByStats(
99-
compiler: Plugin.BaseCompiler,
100-
stats: Plugin.StatsCompilation,
101-
moduleGraph: ModuleGraph,
102-
) {
103-
if (!moduleGraph) {
104-
return;
105-
}
106-
try {
107-
const parsedModulesData =
108-
(await ChunksBuildUtils.getAssetsModulesData(
109-
stats,
110-
compiler.outputPath,
111-
)) || {};
112-
ChunksUtils.transformAssetsModulesData(parsedModulesData, moduleGraph);
113-
} catch (e) {}
114-
}
105+
try {
106+
const parsedModulesData =
107+
(await ChunksBuildUtils.getAssetsModulesData(
108+
stats,
109+
compiler.outputPath,
110+
)) || {};
111+
ChunksUtils.transformAssetsModulesData(parsedModulesData, moduleGraph);
112+
} catch (e) {}
113+
}

0 commit comments

Comments
 (0)