@rsdoctor/components 1.0.0-beta.1 → 1.0.0-beta.3
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.
|
@@ -25,11 +25,6 @@ const BundleAlert = ({
|
|
|
25
25
|
label: "Cross Chunks Package",
|
|
26
26
|
data: []
|
|
27
27
|
},
|
|
28
|
-
{
|
|
29
|
-
key: "E1005",
|
|
30
|
-
label: "Default Import Check",
|
|
31
|
-
data: []
|
|
32
|
-
},
|
|
33
28
|
{
|
|
34
29
|
key: "E1003",
|
|
35
30
|
label: "Loader Performance Optimization",
|
|
@@ -39,6 +34,11 @@ const BundleAlert = ({
|
|
|
39
34
|
key: "E1004",
|
|
40
35
|
label: "ECMA Version Check",
|
|
41
36
|
data: []
|
|
37
|
+
},
|
|
38
|
+
{
|
|
39
|
+
key: "E1005",
|
|
40
|
+
label: "Default Import Check",
|
|
41
|
+
data: []
|
|
42
42
|
}
|
|
43
43
|
];
|
|
44
44
|
dataSource.forEach((data) => {
|
|
@@ -1,12 +1,7 @@
|
|
|
1
1
|
import { jsx } from "react/jsx-runtime";
|
|
2
2
|
import { useEffect } from "react";
|
|
3
3
|
import { SDK } from "@rsdoctor/types";
|
|
4
|
-
import {
|
|
5
|
-
hasViewModeFromStorage,
|
|
6
|
-
useBundleAlertsByErrors,
|
|
7
|
-
useViewMode,
|
|
8
|
-
useI18n
|
|
9
|
-
} from "../../utils";
|
|
4
|
+
import { hasViewModeFromStorage, useViewMode, useI18n } from "../../utils";
|
|
10
5
|
import { BundleAlert } from "./bundle-alert";
|
|
11
6
|
import { withServerAPI } from "../Manifest";
|
|
12
7
|
import { ViewMode } from "../../constants";
|
|
@@ -17,7 +12,7 @@ const BundleAlertsBase = ({
|
|
|
17
12
|
project
|
|
18
13
|
}) => {
|
|
19
14
|
const { errors, root: cwd } = project;
|
|
20
|
-
const bundleAlerts =
|
|
15
|
+
const bundleAlerts = errors;
|
|
21
16
|
const { setBundleAlertsViewMode, viewMode, setViewMode } = useViewMode();
|
|
22
17
|
const { t } = useI18n();
|
|
23
18
|
const dataSource = filter ? bundleAlerts.filter(filter) : bundleAlerts;
|
|
@@ -14,7 +14,13 @@ const CommonList = (props) => {
|
|
|
14
14
|
style: {
|
|
15
15
|
background: "#fff"
|
|
16
16
|
},
|
|
17
|
-
description: /* @__PURE__ */ jsx(
|
|
17
|
+
description: /* @__PURE__ */ jsx(
|
|
18
|
+
"div",
|
|
19
|
+
{
|
|
20
|
+
className: styles.description,
|
|
21
|
+
dangerouslySetInnerHTML: { __html: description || "" }
|
|
22
|
+
}
|
|
23
|
+
),
|
|
18
24
|
icon: /* @__PURE__ */ jsx(Button, { onClick: () => navigate, type: "link", children: "more" })
|
|
19
25
|
}
|
|
20
26
|
);
|
|
@@ -338,21 +338,22 @@ const AssetDetail = ({
|
|
|
338
338
|
Tooltip,
|
|
339
339
|
{
|
|
340
340
|
title: /* @__PURE__ */ jsxs(Space, { direction: "vertical", children: [
|
|
341
|
-
/* @__PURE__ */ jsx(Tag, { color: "orange", children:
|
|
342
|
-
/* @__PURE__ */ jsx(Tag, { color: "volcano", children:
|
|
341
|
+
/* @__PURE__ */ jsx(Tag, { color: "orange", children: `Bundled Size: ${formatSize(parsedSize)}` }),
|
|
342
|
+
/* @__PURE__ */ jsx(Tag, { color: "volcano", children: `Source Size: ${formatSize(sourceSize)}` })
|
|
343
343
|
] }),
|
|
344
344
|
color: "white",
|
|
345
|
-
children: /* @__PURE__ */ jsx(Tag, { color: "purple", style: tagStyle, children:
|
|
345
|
+
children: /* @__PURE__ */ jsx(Tag, { color: "purple", style: tagStyle, children: `Bundled Size: ${formatSize(parsedSize)}` })
|
|
346
346
|
}
|
|
347
347
|
) : sourceSize !== 0 ? (
|
|
348
348
|
// fallback to display tag for source size
|
|
349
|
-
/* @__PURE__ */ jsx(Tag, { color: "geekblue", children:
|
|
349
|
+
/* @__PURE__ */ jsx(Tag, { color: "geekblue", children: `Source Size: ${formatSize(sourceSize)}` })
|
|
350
350
|
) : null,
|
|
351
351
|
isConcatenation ? /* @__PURE__ */ jsx(
|
|
352
352
|
Tooltip,
|
|
353
353
|
{
|
|
354
354
|
title: /* @__PURE__ */ jsx(Space, { children: /* @__PURE__ */ jsxs(Typography.Text, { style: { color: "inherit" }, children: [
|
|
355
355
|
"this is a concatenated module, it contains",
|
|
356
|
+
" ",
|
|
356
357
|
mod.modules?.length,
|
|
357
358
|
" modules"
|
|
358
359
|
] }) }),
|
|
@@ -45,39 +45,54 @@ const tabList = [
|
|
|
45
45
|
/* @__PURE__ */ jsx(
|
|
46
46
|
Tooltip,
|
|
47
47
|
{
|
|
48
|
+
overlayStyle: { maxWidth: 380 },
|
|
49
|
+
overlayInnerStyle: { marginLeft: 16, padding: 10 },
|
|
48
50
|
color: "white",
|
|
49
|
-
title: /* @__PURE__ */ jsxs(Space, { direction: "vertical", color: "white", children: [
|
|
51
|
+
title: /* @__PURE__ */ jsxs(Space, { direction: "vertical", color: "white", size: "middle", children: [
|
|
50
52
|
/* @__PURE__ */ jsx(Row, { children: /* @__PURE__ */ jsxs(Col, { children: [
|
|
51
53
|
/* @__PURE__ */ jsx(Tag, { color: "cyan", style: { margin: 0 }, children: "initial" }),
|
|
52
|
-
/* @__PURE__ */ jsx(Typography.Text, { children: "
|
|
54
|
+
/* @__PURE__ */ jsx(Typography.Text, { style: { marginLeft: 4 }, children: "Identify whether the chunk is an initial chunk." })
|
|
53
55
|
] }) }),
|
|
54
56
|
/* @__PURE__ */ jsx(Row, { children: /* @__PURE__ */ jsxs(Col, { children: [
|
|
55
|
-
/* @__PURE__ */ jsx(Tag, { color: "green", children: "concatenated" }),
|
|
56
|
-
/* @__PURE__ */ jsx(Typography.Text, { children: "
|
|
57
|
-
/* @__PURE__ */ jsx(
|
|
58
|
-
|
|
59
|
-
|
|
57
|
+
/* @__PURE__ */ jsx(Tag, { color: "green", style: { margin: 0 }, children: "concatenated" }),
|
|
58
|
+
/* @__PURE__ */ jsx(Typography.Text, { style: { marginLeft: 4 }, children: "Identify whether the module is a concatenated module" }),
|
|
59
|
+
/* @__PURE__ */ jsx(
|
|
60
|
+
Tooltip,
|
|
61
|
+
{
|
|
62
|
+
overlayStyle: { maxWidth: 408 },
|
|
63
|
+
placement: "bottom",
|
|
64
|
+
color: "white",
|
|
65
|
+
title: /* @__PURE__ */ jsx(Space, { direction: "vertical", color: "white", children: /* @__PURE__ */ jsx(Row, { children: /* @__PURE__ */ jsxs(Col, { children: [
|
|
66
|
+
/* @__PURE__ */ jsx(Typography.Text, { strong: true, children: "Concatenated Module" }),
|
|
67
|
+
/* @__PURE__ */ jsx(Typography.Text, { children: ': A performance optimization where multiple modules are merged (or "hoisted") into a single scope instead of wrapping each module in separate function closures. This reduces the bundle size and improves runtime performance by minimizing function call overhead.' })
|
|
68
|
+
] }) }) }),
|
|
69
|
+
children: /* @__PURE__ */ jsx(
|
|
70
|
+
InfoCircleOutlined,
|
|
71
|
+
{
|
|
72
|
+
style: { color: "rgba(0,0,0,.45)", marginLeft: 4 }
|
|
73
|
+
}
|
|
74
|
+
)
|
|
75
|
+
}
|
|
76
|
+
),
|
|
77
|
+
/* @__PURE__ */ jsx(Typography.Text, { children: "." })
|
|
60
78
|
] }) }),
|
|
61
79
|
/* @__PURE__ */ jsx(Row, { children: /* @__PURE__ */ jsxs(Col, { children: [
|
|
62
80
|
/* @__PURE__ */ jsx(Button, { size: "small", icon: /* @__PURE__ */ jsx(CodepenCircleOutlined, {}) }),
|
|
63
|
-
/* @__PURE__ */ jsx(Typography.Text, { children: "
|
|
81
|
+
/* @__PURE__ */ jsx(Typography.Text, { style: { marginLeft: 4 }, children: "Open the code." })
|
|
64
82
|
] }) }),
|
|
65
83
|
/* @__PURE__ */ jsx(Row, { children: /* @__PURE__ */ jsxs(Col, { children: [
|
|
66
84
|
/* @__PURE__ */ jsx(Button, { size: "small", icon: /* @__PURE__ */ jsx(DeploymentUnitOutlined, {}) }),
|
|
67
|
-
/* @__PURE__ */ jsx(Typography.Text, { children: "
|
|
85
|
+
/* @__PURE__ */ jsx(Typography.Text, { style: { marginLeft: 4 }, children: "View the module dependency, that is, module reasons in stats.json." })
|
|
68
86
|
] }) }),
|
|
69
87
|
/* @__PURE__ */ jsx(Row, { children: /* @__PURE__ */ jsxs(Col, { children: [
|
|
70
88
|
/* @__PURE__ */ jsx(Tag, { color: "purple", children: "Bundled: 15.77 KB" }),
|
|
71
|
-
/* @__PURE__ */ jsx(Typography.Text, {
|
|
72
|
-
/* @__PURE__ */ jsx(Typography.Text, { children: "The size of the code which bundled. That is, after bundle and tree-shaking." })
|
|
89
|
+
/* @__PURE__ */ jsx(Typography.Text, { children: "The final size of the output files after processing, bundling, and optimization. This is what is delivered to the browser." })
|
|
73
90
|
] }) }),
|
|
74
91
|
/* @__PURE__ */ jsx(Row, { children: /* @__PURE__ */ jsxs(Col, { children: [
|
|
75
|
-
/* @__PURE__ */ jsx(Tag, { color: "orange", children: "Source:
|
|
76
|
-
/* @__PURE__ */ jsx(Typography.Text, {
|
|
77
|
-
/* @__PURE__ */ jsx(Typography.Text, { children: "The size of the code which before bundle and transform." })
|
|
92
|
+
/* @__PURE__ */ jsx(Tag, { color: "orange", children: "Source: 60.46 KB" }),
|
|
93
|
+
/* @__PURE__ */ jsx(Typography.Text, { children: "The original size of your source code files before any processing or transformations. This is the raw size of your code as you wrote it." })
|
|
78
94
|
] }) })
|
|
79
95
|
] }),
|
|
80
|
-
style: { marginLeft: 3 },
|
|
81
96
|
children: /* @__PURE__ */ jsx(InfoCircleOutlined, { style: { color: "rgba(0,0,0,.45)" } })
|
|
82
97
|
}
|
|
83
98
|
)
|
|
@@ -242,6 +257,7 @@ const WebpackModulesOverallBase = ({ errors, cwd, summary, entryPoints }) => {
|
|
|
242
257
|
{
|
|
243
258
|
description: /* @__PURE__ */ jsxs("div", { children: [
|
|
244
259
|
"Tile graph is disabled,",
|
|
260
|
+
" ",
|
|
245
261
|
/* @__PURE__ */ jsx("a", { href: "https://rsdoctor.dev/config/options/options#generatetilegraph", children: "see the documentation to learn how to enable." })
|
|
246
262
|
] })
|
|
247
263
|
}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@rsdoctor/components",
|
|
3
|
-
"version": "1.0.0-beta.
|
|
3
|
+
"version": "1.0.0-beta.3",
|
|
4
4
|
"main": "./dist/index.js",
|
|
5
5
|
"license": "MIT",
|
|
6
6
|
"module": "dist/index.js",
|
|
@@ -71,9 +71,9 @@
|
|
|
71
71
|
"socket.io-client": "4.6.1",
|
|
72
72
|
"typescript": "^5.2.2",
|
|
73
73
|
"url-parse": "1.5.10",
|
|
74
|
-
"@rsdoctor/graph": "1.0.0-beta.
|
|
75
|
-
"@rsdoctor/types": "1.0.0-beta.
|
|
76
|
-
"@rsdoctor/utils": "1.0.0-beta.
|
|
74
|
+
"@rsdoctor/graph": "1.0.0-beta.3",
|
|
75
|
+
"@rsdoctor/types": "1.0.0-beta.3",
|
|
76
|
+
"@rsdoctor/utils": "1.0.0-beta.3"
|
|
77
77
|
},
|
|
78
78
|
"publishConfig": {
|
|
79
79
|
"access": "public",
|