@modern-js/plugin-devtools 2.54.6 → 2.56.0
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.
- package/dist/cli.d.ts +1 -0
- package/dist/cli.js +13 -7
- package/dist/plugins/cleanup.js +1 -0
- package/dist/plugins/debug.js +12 -10
- package/dist/plugins/html.js +4 -8
- package/dist/plugins/http.d.ts +3 -1
- package/dist/plugins/http.js +13 -22
- package/dist/plugins/manifest.js +14 -3
- package/dist/plugins/route.d.ts +0 -0
- package/dist/plugins/route.js +1 -0
- package/dist/plugins/rpc.js +3 -1
- package/dist/plugins/service-worker.js +1 -0
- package/dist/plugins/settle.js +1 -0
- package/dist/plugins/state.js +61 -56
- package/dist/plugins/watcher.js +1 -0
- package/dist/runtime.js +31 -6
- package/dist/types/common.d.ts +7 -1
- package/package.json +16 -14
package/dist/cli.d.ts
CHANGED
@@ -5,6 +5,7 @@ import { Plugin } from './types';
|
|
5
5
|
export type { DevtoolsPluginOptions };
|
6
6
|
export type DevtoolsPlugin = CliPlugin<AppTools> & {
|
7
7
|
setClientDefinition: (def: ClientDefinition) => void;
|
8
|
+
plugins: Plugin[];
|
8
9
|
};
|
9
10
|
export declare const BUILTIN_PLUGINS: Plugin[];
|
10
11
|
export declare const devtoolsPlugin: (inlineOptions?: DevtoolsPluginOptions) => DevtoolsPlugin;
|
package/dist/cli.js
CHANGED
@@ -53,10 +53,10 @@ const BUILTIN_PLUGINS = [
|
|
53
53
|
import_debug.pluginDebug,
|
54
54
|
import_watcher.pluginWatcher,
|
55
55
|
import_service_worker.pluginServiceWorker,
|
56
|
-
import_html.pluginHtml,
|
57
56
|
// --- //
|
58
|
-
import_state.pluginState,
|
59
57
|
import_http.pluginHttp,
|
58
|
+
import_html.pluginHtml,
|
59
|
+
import_state.pluginState,
|
60
60
|
import_rpc.pluginRpc,
|
61
61
|
import_settle.pluginSettleState,
|
62
62
|
import_manifest.pluginManifest,
|
@@ -85,12 +85,12 @@ const devtoolsPlugin = (inlineOptions = {}) => {
|
|
85
85
|
setupBuilder.reject(new Error("Devtools Plugin is disabled"));
|
86
86
|
setupFramework.reject(new Error("Devtools Plugin is disabled"));
|
87
87
|
});
|
88
|
-
|
89
|
-
plugin.setup(api);
|
90
|
-
}
|
91
|
-
return {
|
88
|
+
const instance = {
|
92
89
|
name: "@modern-js/plugin-devtools",
|
93
90
|
usePlugins: [],
|
91
|
+
plugins: [
|
92
|
+
...BUILTIN_PLUGINS
|
93
|
+
],
|
94
94
|
setClientDefinition(def) {
|
95
95
|
Object.assign(ctx.def, def);
|
96
96
|
},
|
@@ -98,6 +98,10 @@ const devtoolsPlugin = (inlineOptions = {}) => {
|
|
98
98
|
if (!ctx.enable)
|
99
99
|
return {};
|
100
100
|
setupFramework.resolve(frameworkApi);
|
101
|
+
for (const plugin of instance.plugins) {
|
102
|
+
await plugin.setup(api);
|
103
|
+
}
|
104
|
+
await api.frameworkHooks.callHook("setup", frameworkApi);
|
101
105
|
return {
|
102
106
|
async prepare() {
|
103
107
|
await api.frameworkHooks.callHook("prepare");
|
@@ -130,7 +134,8 @@ const devtoolsPlugin = (inlineOptions = {}) => {
|
|
130
134
|
const configs = await api.frameworkHooks.callHookParallel("config");
|
131
135
|
const builderPlugin = {
|
132
136
|
name: "builder-plugin-devtools",
|
133
|
-
setup(builderApi) {
|
137
|
+
async setup(builderApi) {
|
138
|
+
await api.builderHooks.callHook("setup", builderApi);
|
134
139
|
setupBuilder.resolve(builderApi);
|
135
140
|
builderApi.modifyBundlerChain(async (options, utils) => {
|
136
141
|
await api.builderHooks.callHook("modifyBundlerChain", options, utils);
|
@@ -168,6 +173,7 @@ const devtoolsPlugin = (inlineOptions = {}) => {
|
|
168
173
|
};
|
169
174
|
}
|
170
175
|
};
|
176
|
+
return instance;
|
171
177
|
};
|
172
178
|
var cli_default = devtoolsPlugin;
|
173
179
|
// Annotate the CommonJS export names for ESM import in node:
|
package/dist/plugins/cleanup.js
CHANGED
package/dist/plugins/debug.js
CHANGED
@@ -26,19 +26,21 @@ const logger = (0, import_utils.createLogger)({
|
|
26
26
|
level: process.env.LOG_LEVEL || "info"
|
27
27
|
});
|
28
28
|
const pluginDebug = {
|
29
|
+
name: "debug",
|
29
30
|
async setup(api) {
|
30
31
|
await api.setupFramework();
|
31
32
|
logger.debug("setup framework api");
|
32
|
-
|
33
|
-
|
34
|
-
|
35
|
-
|
36
|
-
|
37
|
-
|
38
|
-
|
39
|
-
|
40
|
-
|
41
|
-
|
33
|
+
api.builderHooks.hook("setup", () => {
|
34
|
+
logger.debug("setup builder api");
|
35
|
+
api.builderHooks.beforeEach((e) => {
|
36
|
+
logger.debug("after builder hook:", e.name);
|
37
|
+
});
|
38
|
+
api.frameworkHooks.beforeEach((e) => {
|
39
|
+
logger.debug("after framework hook:", e.name);
|
40
|
+
});
|
41
|
+
api.hooks.beforeEach((e) => {
|
42
|
+
logger.debug("after hook:", e.name);
|
43
|
+
});
|
42
44
|
});
|
43
45
|
}
|
44
46
|
};
|
package/dist/plugins/html.js
CHANGED
@@ -32,22 +32,18 @@ __export(html_exports, {
|
|
32
32
|
});
|
33
33
|
module.exports = __toCommonJS(html_exports);
|
34
34
|
const pluginHtml = {
|
35
|
+
name: "html",
|
35
36
|
async setup(api) {
|
36
37
|
api.frameworkHooks.hook("config", async () => {
|
37
|
-
|
38
|
-
|
39
|
-
src: "/__devtools"
|
40
|
-
};
|
41
|
-
Object.assign(clientOptions, {
|
42
|
-
__keep: true
|
43
|
-
});
|
38
|
+
var _api_vars_http;
|
39
|
+
const port = (_api_vars_http = api.vars.http) === null || _api_vars_http === void 0 ? void 0 : _api_vars_http.port;
|
44
40
|
const config = {
|
45
41
|
source: {
|
46
42
|
preEntry: [
|
47
43
|
require.resolve("../runtime")
|
48
44
|
],
|
49
45
|
globalVars: {
|
50
|
-
"process.env.__USE_MODERNJS_DEVTOOLS__":
|
46
|
+
"process.env.__USE_MODERNJS_DEVTOOLS__": port ? `http://localhost:${port}/manifest` : null
|
51
47
|
}
|
52
48
|
}
|
53
49
|
};
|
package/dist/plugins/http.d.ts
CHANGED
package/dist/plugins/http.js
CHANGED
@@ -36,6 +36,7 @@ var import_assert = __toESM(require("assert"));
|
|
36
36
|
var import_http = __toESM(require("http"));
|
37
37
|
var import_url = require("url");
|
38
38
|
var import_hono = require("hono");
|
39
|
+
var import_cors = require("hono/cors");
|
39
40
|
var import_utils = require("@modern-js/utils");
|
40
41
|
var import_node_server = require("@hono/node-server");
|
41
42
|
var import_serve_static = require("@hono/node-server/serve-static");
|
@@ -78,16 +79,14 @@ const hotUpdateHandler = async (c) => {
|
|
78
79
|
}
|
79
80
|
return newResp;
|
80
81
|
};
|
81
|
-
const fallbackHtmlHandler = async (c) => {
|
82
|
-
const filename = import_path.default.resolve(CLIENT_SERVE_DIR, "html/client/index.html");
|
83
|
-
const content = await import_utils.fs.readFile(filename, "utf-8");
|
84
|
-
return c.html(content);
|
85
|
-
};
|
86
82
|
const pluginHttp = {
|
83
|
+
name: "http",
|
87
84
|
async setup(api) {
|
88
|
-
|
85
|
+
const disableHttpServer = process.env.NODE_ENV === "production" || process.env.DEVTOOLS_HTTP_SERVER === "false";
|
86
|
+
if (disableHttpServer)
|
89
87
|
return;
|
90
88
|
const app = new import_hono.Hono();
|
89
|
+
app.use("*", (0, import_cors.cors)());
|
91
90
|
app.all("/api/cookies", cookiesServiceHandler);
|
92
91
|
app.use(
|
93
92
|
"/static/*",
|
@@ -103,7 +102,6 @@ const pluginHttp = {
|
|
103
102
|
"Content-Type": "application/json"
|
104
103
|
});
|
105
104
|
});
|
106
|
-
app.get("*", fallbackHtmlHandler);
|
107
105
|
const server = (0, import_node_server.createAdaptorServer)({
|
108
106
|
fetch: app.fetch,
|
109
107
|
hostname: "127.0.0.1",
|
@@ -111,29 +109,22 @@ const pluginHttp = {
|
|
111
109
|
allowHTTP1: true
|
112
110
|
}
|
113
111
|
});
|
112
|
+
const port = await (0, import_utils.getPort)(8782, {
|
113
|
+
slient: true
|
114
|
+
});
|
114
115
|
(0, import_assert.default)(server instanceof import_http.default.Server, "instance should be http.Server");
|
115
|
-
|
116
|
+
server.listen(port);
|
117
|
+
api.vars.http = Object.assign(server, {
|
118
|
+
port
|
119
|
+
});
|
116
120
|
api.frameworkHooks.hook("config", async () => {
|
117
|
-
const port = await (0, import_utils.getPort)(8782, {
|
118
|
-
slient: true
|
119
|
-
});
|
120
|
-
server.listen(port);
|
121
121
|
const proxy = {
|
122
122
|
[import_node.ROUTE_BASENAME]: {
|
123
123
|
target: `http://127.0.0.1:${port}`,
|
124
124
|
pathRewrite: {
|
125
125
|
[`^${import_node.ROUTE_BASENAME}`]: ""
|
126
126
|
},
|
127
|
-
ws: true
|
128
|
-
onProxyReq(proxyReq, req) {
|
129
|
-
const addrInfo = req.socket.address();
|
130
|
-
if ("address" in addrInfo) {
|
131
|
-
const { address } = addrInfo;
|
132
|
-
proxyReq.setHeader("X-Forwarded-For", address);
|
133
|
-
} else {
|
134
|
-
proxyReq.removeHeader("X-Forwarded-For");
|
135
|
-
}
|
136
|
-
}
|
127
|
+
ws: true
|
137
128
|
}
|
138
129
|
};
|
139
130
|
return {
|
package/dist/plugins/manifest.js
CHANGED
@@ -36,20 +36,31 @@ var import_node = require("@modern-js/devtools-kit/node");
|
|
36
36
|
var import_utils = require("@modern-js/utils");
|
37
37
|
var import_p_defer = __toESM(require("p-defer"));
|
38
38
|
const pluginManifest = {
|
39
|
+
name: "manifest",
|
39
40
|
async setup(api) {
|
40
41
|
const deferredManifest = (0, import_p_defer.default)();
|
41
42
|
const deferredManifestJson = (0, import_p_defer.default)();
|
42
43
|
api.vars.useManifest = deferredManifest.promise;
|
43
44
|
api.vars.useManifestJson = deferredManifestJson.promise;
|
44
45
|
api.hooks.hook("settleState", async () => {
|
46
|
+
var _api_vars_http;
|
45
47
|
const routesManifestName = require.resolve("@modern-js/devtools-client/manifest");
|
46
48
|
const routesManifest = await import_utils.fs.readJSON(routesManifestName);
|
47
49
|
const manifest = {
|
48
50
|
...api.vars.state,
|
49
|
-
|
50
|
-
|
51
|
-
routeAssets: routesManifest.routeAssets
|
51
|
+
routeAssets: routesManifest.routeAssets,
|
52
|
+
version: require("../../package.json").version
|
52
53
|
};
|
54
|
+
const port = (_api_vars_http = api.vars.http) === null || _api_vars_http === void 0 ? void 0 : _api_vars_http.port;
|
55
|
+
if (port) {
|
56
|
+
manifest.client = `http://localhost:${port}/static/html/client/index.html`;
|
57
|
+
if (process.env.DEVTOOLS_RPC !== "false") {
|
58
|
+
manifest.websocket = `ws://localhost:${port}/rpc`;
|
59
|
+
}
|
60
|
+
}
|
61
|
+
await api.hooks.callHook("createManifest", {
|
62
|
+
manifest
|
63
|
+
});
|
53
64
|
api.vars.manifest = manifest;
|
54
65
|
deferredManifest.resolve(manifest);
|
55
66
|
const stringified = JSON.stringify(manifest, (0, import_node.replacer)());
|
File without changes
|
@@ -0,0 +1 @@
|
|
1
|
+
"use strict";
|
package/dist/plugins/rpc.js
CHANGED
@@ -41,9 +41,11 @@ var flatted = __toESM(require("flatted"));
|
|
41
41
|
var import_valtio = require("valtio");
|
42
42
|
var import_socket = require("../utils/socket");
|
43
43
|
const pluginRpc = {
|
44
|
+
name: "rpc",
|
44
45
|
async setup(api) {
|
45
46
|
const httpServer = api.vars.http;
|
46
|
-
|
47
|
+
const disableRpc = process.env.DEVTOOLS_RPC === "false";
|
48
|
+
if (!httpServer || disableRpc)
|
47
49
|
return;
|
48
50
|
const server = new import_socket.SocketServer({
|
49
51
|
server: httpServer,
|
@@ -32,6 +32,7 @@ __export(service_worker_exports, {
|
|
32
32
|
});
|
33
33
|
module.exports = __toCommonJS(service_worker_exports);
|
34
34
|
const pluginServiceWorker = {
|
35
|
+
name: "service-worker",
|
35
36
|
async setup(api) {
|
36
37
|
api.frameworkHooks.hook("modifyServerRoutes", ({ routes }) => {
|
37
38
|
routes.push({
|
package/dist/plugins/settle.js
CHANGED
package/dist/plugins/state.js
CHANGED
@@ -114,6 +114,7 @@ const getDoctorOverview = async (ctx) => {
|
|
114
114
|
};
|
115
115
|
};
|
116
116
|
const pluginState = {
|
117
|
+
name: "state",
|
117
118
|
async setup(api) {
|
118
119
|
api.vars.state = (0, import_valtio.proxy)({
|
119
120
|
framework: {
|
@@ -132,66 +133,70 @@ const pluginState = {
|
|
132
133
|
api.frameworkHooks.hook("modifyFileSystemRoutes", ({ entrypoint, routes }) => {
|
133
134
|
api.vars.state.fileSystemRoutes[entrypoint.entryName] = import_lodash.default.cloneDeep(routes);
|
134
135
|
});
|
135
|
-
|
136
|
-
|
137
|
-
|
138
|
-
|
136
|
+
api.frameworkHooks.hook("setup", async (frameworkApi) => {
|
137
|
+
api.frameworkHooks.hook("prepare", async () => {
|
138
|
+
const frameworkContext = {
|
139
|
+
...frameworkApi.useAppContext(),
|
140
|
+
builder: null,
|
141
|
+
serverInternalPlugins: null
|
142
|
+
};
|
143
|
+
api.hooks.hook("settleState", async () => {
|
144
|
+
try {
|
145
|
+
api.vars.state.doctor = await getDoctorOverview(frameworkContext);
|
146
|
+
} catch (err) {
|
147
|
+
}
|
148
|
+
});
|
149
|
+
api.vars.state.framework = {
|
150
|
+
context: frameworkContext,
|
151
|
+
config: {
|
152
|
+
resolved: frameworkApi.useConfigContext(),
|
153
|
+
transformed: frameworkApi.useResolvedConfigContext()
|
154
|
+
}
|
155
|
+
};
|
156
|
+
});
|
139
157
|
});
|
140
|
-
api.builderHooks.hook("
|
141
|
-
api.vars.state.builder.
|
142
|
-
|
143
|
-
|
158
|
+
api.builderHooks.hook("setup", (builderApi) => {
|
159
|
+
api.vars.state.builder.context = builderApi.context;
|
160
|
+
resolveDependencies(builderApi.context.rootPath).then((deps) => {
|
161
|
+
api.vars.state.dependencies = deps;
|
162
|
+
});
|
163
|
+
api.builderHooks.hook("modifyBundlerChain", () => {
|
164
|
+
api.vars.state.builder.config = {
|
165
|
+
resolved: import_lodash.default.cloneDeep(builderApi.getRsbuildConfig()),
|
166
|
+
transformed: import_lodash.default.cloneDeep(builderApi.getNormalizedConfig())
|
167
|
+
};
|
168
|
+
});
|
169
|
+
const bundlerConfigs = [];
|
170
|
+
const handleBundlerConfig = (config) => {
|
171
|
+
const expectBundlerNum = Object.keys(builderApi.getNormalizedConfig().environments).length;
|
172
|
+
bundlerConfigs.push(config);
|
173
|
+
if (bundlerConfigs.length >= expectBundlerNum) {
|
174
|
+
api.vars.state.bundler.configs.resolved = import_lodash.default.cloneDeep(bundlerConfigs);
|
175
|
+
}
|
144
176
|
};
|
145
|
-
|
146
|
-
|
147
|
-
|
148
|
-
|
149
|
-
bundlerConfigs.push(config);
|
150
|
-
if (bundlerConfigs.length >= expectBundlerNum) {
|
151
|
-
api.vars.state.bundler.configs.resolved = import_lodash.default.cloneDeep(bundlerConfigs);
|
152
|
-
}
|
153
|
-
};
|
154
|
-
if (builderApi.context.bundlerType === "webpack") {
|
155
|
-
api.builderHooks.hook("modifyWebpackConfig", handleBundlerConfig);
|
156
|
-
} else {
|
157
|
-
api.builderHooks.hook("modifyRspackConfig", handleBundlerConfig);
|
158
|
-
}
|
159
|
-
api.builderHooks.hook("onBeforeCreateCompiler", ({ bundlerConfigs: bundlerConfigs2 }) => {
|
160
|
-
api.vars.state.bundler.configs.transformed = import_lodash.default.cloneDeep(bundlerConfigs2);
|
161
|
-
});
|
162
|
-
let buildStartedAt = NaN;
|
163
|
-
api.builderHooks.hook("onAfterCreateCompiler", () => {
|
164
|
-
buildStartedAt = Date.now();
|
165
|
-
});
|
166
|
-
api.builderHooks.hook("onDevCompileDone", () => {
|
167
|
-
api.vars.state.performance = {
|
168
|
-
compileDuration: Date.now() - buildStartedAt
|
169
|
-
};
|
170
|
-
});
|
171
|
-
api.builderHooks.hook("onAfterBuild", () => {
|
172
|
-
api.vars.state.performance = {
|
173
|
-
compileDuration: Date.now() - buildStartedAt
|
174
|
-
};
|
175
|
-
});
|
176
|
-
api.hooks.hook("settleState", async () => {
|
177
|
-
try {
|
178
|
-
api.vars.state.doctor = await getDoctorOverview(frameworkContext);
|
179
|
-
} catch (err) {
|
177
|
+
if (builderApi.context.bundlerType === "webpack") {
|
178
|
+
api.builderHooks.hook("modifyWebpackConfig", handleBundlerConfig);
|
179
|
+
} else {
|
180
|
+
api.builderHooks.hook("modifyRspackConfig", handleBundlerConfig);
|
180
181
|
}
|
182
|
+
api.builderHooks.hook("onBeforeCreateCompiler", ({ bundlerConfigs: bundlerConfigs2 }) => {
|
183
|
+
api.vars.state.bundler.configs.transformed = import_lodash.default.cloneDeep(bundlerConfigs2);
|
184
|
+
});
|
185
|
+
let buildStartedAt = NaN;
|
186
|
+
api.builderHooks.hook("onAfterCreateCompiler", () => {
|
187
|
+
buildStartedAt = Date.now();
|
188
|
+
});
|
189
|
+
api.builderHooks.hook("onDevCompileDone", () => {
|
190
|
+
api.vars.state.performance = {
|
191
|
+
compileDuration: Date.now() - buildStartedAt
|
192
|
+
};
|
193
|
+
});
|
194
|
+
api.builderHooks.hook("onAfterBuild", () => {
|
195
|
+
api.vars.state.performance = {
|
196
|
+
compileDuration: Date.now() - buildStartedAt
|
197
|
+
};
|
198
|
+
});
|
181
199
|
});
|
182
|
-
const frameworkApi = await api.setupFramework();
|
183
|
-
const frameworkContext = {
|
184
|
-
...frameworkApi.useAppContext(),
|
185
|
-
builder: null,
|
186
|
-
serverInternalPlugins: null
|
187
|
-
};
|
188
|
-
api.vars.state.framework = {
|
189
|
-
context: frameworkContext,
|
190
|
-
config: {
|
191
|
-
resolved: frameworkApi.useConfigContext(),
|
192
|
-
transformed: frameworkApi.useResolvedConfigContext()
|
193
|
-
}
|
194
|
-
};
|
195
200
|
}
|
196
201
|
};
|
197
202
|
// Annotate the CommonJS export names for ESM import in node:
|
package/dist/plugins/watcher.js
CHANGED
@@ -25,6 +25,7 @@ var import_utils = require("@modern-js/utils");
|
|
25
25
|
var import_config = require("../utils/config");
|
26
26
|
var import_options = require("../options");
|
27
27
|
const pluginWatcher = {
|
28
|
+
name: "watcher",
|
28
29
|
async setup(api) {
|
29
30
|
const frameworkApi = await api.setupFramework();
|
30
31
|
const basename = `${api.context.def.name.shortName}.runtime.json`;
|
package/dist/runtime.js
CHANGED
@@ -1,5 +1,25 @@
|
|
1
1
|
"use strict";
|
2
|
-
var
|
2
|
+
var import_backend = require("react-devtools-inline/backend");
|
3
|
+
if (process.env.NODE_ENV === "development" && !window.opener) {
|
4
|
+
try {
|
5
|
+
try {
|
6
|
+
delete window.__REACT_DEVTOOLS_GLOBAL_HOOK__;
|
7
|
+
} catch {
|
8
|
+
}
|
9
|
+
(0, import_backend.initialize)(window);
|
10
|
+
const originSubHook = window.__REACT_DEVTOOLS_GLOBAL_HOOK__.sub;
|
11
|
+
window.__REACT_DEVTOOLS_GLOBAL_HOOK__.sub = (e, handler) => {
|
12
|
+
if (e === "devtools-backend-installed") {
|
13
|
+
return void 0;
|
14
|
+
}
|
15
|
+
return originSubHook(e, handler);
|
16
|
+
};
|
17
|
+
} catch (err) {
|
18
|
+
const e = new Error("Failed to inject React DevTools backend.");
|
19
|
+
e.cause = err;
|
20
|
+
console.error(e);
|
21
|
+
}
|
22
|
+
}
|
3
23
|
const fetchSync = (url, body) => {
|
4
24
|
const xhr = new XMLHttpRequest();
|
5
25
|
xhr.open("GET", url, false);
|
@@ -8,8 +28,8 @@ const fetchSync = (url, body) => {
|
|
8
28
|
text() {
|
9
29
|
return xhr.responseText;
|
10
30
|
},
|
11
|
-
json(
|
12
|
-
return JSON.parse(xhr.responseText,
|
31
|
+
json(reviver) {
|
32
|
+
return JSON.parse(xhr.responseText, reviver);
|
13
33
|
},
|
14
34
|
blob() {
|
15
35
|
return new Blob([
|
@@ -21,6 +41,8 @@ const fetchSync = (url, body) => {
|
|
21
41
|
const importScript = (url) => {
|
22
42
|
const script = document.createElement("script");
|
23
43
|
script.setAttribute("src", url);
|
44
|
+
script.async = false;
|
45
|
+
script.defer = false;
|
24
46
|
document.head.appendChild(script);
|
25
47
|
};
|
26
48
|
const importStyle = (url, parent = document.head) => {
|
@@ -34,18 +56,21 @@ const setup = () => {
|
|
34
56
|
var _document_cookie_match;
|
35
57
|
const injectedManifestUrl = process.env.__USE_MODERNJS_DEVTOOLS__;
|
36
58
|
const cookieManifestUrl = (_document_cookie_match = document.cookie.match(/use_modernjs_devtools=([^;]+)/)) === null || _document_cookie_match === void 0 ? void 0 : _document_cookie_match[1];
|
37
|
-
const devtoolsUrl =
|
59
|
+
const devtoolsUrl = injectedManifestUrl || cookieManifestUrl;
|
38
60
|
if (!devtoolsUrl)
|
39
61
|
return;
|
40
|
-
const manifest = fetchSync(devtoolsUrl).json(
|
62
|
+
const manifest = fetchSync(devtoolsUrl).json();
|
41
63
|
manifest.source = devtoolsUrl;
|
64
|
+
if (!manifest.client)
|
65
|
+
return;
|
42
66
|
const template = document.createElement("template");
|
43
67
|
template.id = "_modern_js_devtools_styles";
|
44
68
|
document.body.appendChild(template);
|
45
69
|
const setupScript = document.createElement("script");
|
46
70
|
setupScript.textContent = `${GLOBAL_MANIFEST} = ${JSON.stringify(manifest)};`;
|
47
71
|
document.head.appendChild(setupScript);
|
48
|
-
|
72
|
+
const routeAssets = typeof manifest.routeAssets === "object" ? manifest.routeAssets : fetchSync(manifest.routeAssets).json().routeAssets;
|
73
|
+
for (const src of routeAssets.mount.assets) {
|
49
74
|
if (src.endsWith(".js")) {
|
50
75
|
importScript(src);
|
51
76
|
} else if (src.endsWith(".css")) {
|
package/dist/types/common.d.ts
CHANGED
@@ -4,7 +4,7 @@ import type { AppTools, AppToolsHooks, CliPlugin } from '@modern-js/app-tools';
|
|
4
4
|
import type { ServerPlugin, ToThreads } from '@modern-js/server-core';
|
5
5
|
import type { RsbuildPluginAPI } from '@rsbuild/core';
|
6
6
|
import { Hookable } from 'hookable';
|
7
|
-
import { DevtoolsContext } from '@modern-js/devtools-kit/node';
|
7
|
+
import { DevtoolsContext, ServerManifest } from '@modern-js/devtools-kit/node';
|
8
8
|
export type CliPluginAPI = Parameters<NonNullable<CliPlugin<AppTools>['setup']>>[0];
|
9
9
|
export type ServerPluginAPI = Parameters<NonNullable<ServerPlugin['setup']>>[0];
|
10
10
|
export type BufferLike = string | Buffer | DataView | number | ArrayBufferView | Uint8Array | ArrayBuffer | SharedArrayBuffer | ReadonlyArray<any> | ReadonlyArray<number> | {
|
@@ -26,16 +26,21 @@ export type CleanHooks<T> = {
|
|
26
26
|
export type $FrameworkHooks = CleanHooks<Pick<ToThreads<BaseHooks<any> & AppToolsHooks<any>>, 'prepare' | 'modifyFileSystemRoutes' | 'modifyServerRoutes' | 'afterCreateCompiler' | 'afterDev' | 'beforeRestart' | 'beforeExit' | 'afterBuild'>>;
|
27
27
|
export interface FrameworkHooks extends $FrameworkHooks {
|
28
28
|
config: () => void;
|
29
|
+
setup: (api: CliPluginAPI) => void;
|
29
30
|
}
|
30
31
|
type UnwrapBuilderHooks<T> = {
|
31
32
|
[K in keyof T]: T[K] extends (...args: any) => any ? (...params: [...Parameters<Parameters<T[K]>[0]>]) => void : never;
|
32
33
|
};
|
33
34
|
export type $BuilderHooks = UnwrapBuilderHooks<Pick<RsbuildPluginAPI, 'modifyBundlerChain' | 'modifyWebpackConfig' | 'modifyRspackConfig' | 'onBeforeCreateCompiler' | 'onAfterCreateCompiler' | 'onDevCompileDone' | 'onAfterBuild' | 'onExit'>>;
|
34
35
|
export interface BuilderHooks extends $BuilderHooks {
|
36
|
+
setup: (api: RsbuildPluginAPI) => void;
|
35
37
|
}
|
36
38
|
export interface DevtoolsHooks {
|
37
39
|
cleanup: () => Promise<void> | void;
|
38
40
|
settleState: () => Promise<void> | void;
|
41
|
+
createManifest: (arg: {
|
42
|
+
manifest: ServerManifest;
|
43
|
+
}) => Promise<void> | void;
|
39
44
|
}
|
40
45
|
declare global {
|
41
46
|
interface DevtoolsPluginVars extends Record<string, unknown> {
|
@@ -51,6 +56,7 @@ export interface PluginApi {
|
|
51
56
|
vars: DevtoolsPluginVars;
|
52
57
|
}
|
53
58
|
export interface Plugin {
|
59
|
+
name: string;
|
54
60
|
setup: (api: PluginApi) => Promise<void>;
|
55
61
|
}
|
56
62
|
export {};
|
package/package.json
CHANGED
@@ -15,7 +15,7 @@
|
|
15
15
|
"modern",
|
16
16
|
"modern.js"
|
17
17
|
],
|
18
|
-
"version": "2.
|
18
|
+
"version": "2.56.0",
|
19
19
|
"jsnext:source": "./src/index.ts",
|
20
20
|
"types": "./dist/index.d.ts",
|
21
21
|
"main": "./dist/index.js",
|
@@ -55,28 +55,30 @@
|
|
55
55
|
"valtio": "^1.11.1",
|
56
56
|
"ws": "^8.13.0",
|
57
57
|
"hookable": "^5.5.3",
|
58
|
-
"
|
59
|
-
"@modern-js/
|
60
|
-
"@modern-js/
|
58
|
+
"react-devtools-inline": "^4.28.5",
|
59
|
+
"@modern-js/devtools-kit": "2.56.0",
|
60
|
+
"@modern-js/utils": "2.56.0",
|
61
|
+
"@modern-js/devtools-client": "2.56.0"
|
61
62
|
},
|
62
63
|
"devDependencies": {
|
63
64
|
"@swc/helpers": "0.5.3",
|
64
65
|
"@types/node": "^14",
|
65
66
|
"@types/ws": "^8.5.5",
|
67
|
+
"@types/react-devtools-inline": "^4.24.8",
|
66
68
|
"type-fest": "^4.1.0",
|
67
69
|
"typescript": "^5",
|
68
|
-
"@rsbuild/core": "0.
|
69
|
-
"@modern-js/
|
70
|
-
"@modern-js/
|
71
|
-
"@modern-js/module-tools": "2.
|
72
|
-
"@modern-js/
|
73
|
-
"@modern-js/
|
74
|
-
"@modern-js/
|
75
|
-
"@modern-js/types": "2.
|
76
|
-
"@scripts/build": "2.
|
70
|
+
"@rsbuild/core": "1.0.1-beta.3",
|
71
|
+
"@modern-js/app-tools": "2.56.0",
|
72
|
+
"@modern-js/core": "2.56.0",
|
73
|
+
"@modern-js/module-tools": "2.56.0",
|
74
|
+
"@modern-js/uni-builder": "2.56.0",
|
75
|
+
"@modern-js/server-core": "2.56.0",
|
76
|
+
"@modern-js/runtime": "2.56.0",
|
77
|
+
"@modern-js/types": "2.56.0",
|
78
|
+
"@scripts/build": "2.56.0"
|
77
79
|
},
|
78
80
|
"peerDependencies": {
|
79
|
-
"@modern-js/runtime": "^2.
|
81
|
+
"@modern-js/runtime": "^2.56.0"
|
80
82
|
},
|
81
83
|
"peerDependenciesMeta": {
|
82
84
|
"@modern-js/runtime": {
|