@modern-js/plugin-devtools 0.0.0-next-20240522085356 → 0.0.0-next-20240522113137

package/dist/cli.d.ts

@@ -1,6 +1,6 @@
 import type { AppTools, CliPlugin } from '@modern-js/app-tools';
 import { ClientDefinition } from '@modern-js/devtools-kit/node';
-import { DevtoolsPluginOptions } from './options';
+import { DevtoolsPluginOptions } from './config';
 export type { DevtoolsPluginOptions };
 export type DevtoolsPlugin = CliPlugin<AppTools> & {
     setClientDefinition: (def: ClientDefinition) => void;

package/dist/cli.js

@@ -35,27 +35,14 @@ module.exports = __toCommonJS(cli_exports);
 var import_http = __toESM(require("http"));
 var import_path = __toESM(require("path"));
 var import_assert = __toESM(require("assert"));
-var import_url = require("url");
-var import_lodash = __toESM(require("@modern-js/utils/lodash"));
 var import_utils = require("@modern-js/utils");
-var import_hono = require("hono");
-var import_node_server = require("@hono/node-server");
-var import_serve_static = require("@hono/node-server/serve-static");
+var import_serve_static = __toESM(require("serve-static"));
 var import_node = require("@modern-js/devtools-kit/node");
-var import_valtio = require("valtio");
-var import_options = require("./options");
+var import_config = require("./config");
 var import_rpc = require("./rpc");
 var import_socket = require("./utils/socket");
-var import_config = require("./utils/config");
 const devtoolsPlugin = (inlineOptions = {}) => {
-  const ctx = (0, import_valtio.proxy)((0, import_options.resolveContext)(inlineOptions));
-  let watcher = null;
-  const closeWatcher = () => {
-    if (!watcher)
-      return;
-    watcher.close();
-    watcher = null;
-  };
+  const ctx = (0, import_config.resolveContext)(inlineOptions);
   return {
     name: "@modern-js/plugin-devtools",
     usePlugins: [],
@@ -72,39 +59,15 @@ const devtoolsPlugin = (inlineOptions = {}) => {
       });
       const rpc = await (0, import_rpc.setupClientConnection)({
         api,
-        ctx,
-        server: socketServer
+        server: socketServer,
+        def: ctx.def
       });
       return {
-        async prepare() {
-          await rpc.hooks.prepare();
-          const appConfig = api.useConfigContext();
-          const appCtx = api.useAppContext();
-          const { devtools: options = {} } = appConfig;
-          (0, import_options.updateContext)(ctx, options);
-          const watcher2 = import_utils.chokidar.watch((0, import_config.getConfigFilenames)(), {
-            cwd: appCtx.appDirectory,
-            ignorePermissionErrors: true
-          });
-          const refreshStoragePreset = async () => {
-            const configs = await (0, import_config.loadConfigFiles)(appCtx.appDirectory);
-            if (!configs)
-              return;
-            ctx.storagePresets = [];
-            (0, import_options.updateContext)(ctx, ...configs);
-          };
-          watcher2.on("add", refreshStoragePreset);
-          watcher2.on("change", refreshStoragePreset);
-          watcher2.on("unlink", refreshStoragePreset);
-        },
+        prepare: rpc.hooks.prepare,
         modifyFileSystemRoutes: rpc.hooks.modifyFileSystemRoutes,
         beforeRestart() {
-          closeWatcher();
           return new Promise((resolve, reject) => httpServer.instance.close((err) => err ? reject(err) : resolve()));
         },
-        beforeExit() {
-          closeWatcher();
-        },
         modifyServerRoutes({ routes }) {
           routes.push({
             urlPath: "/sw-proxy.js",
@@ -116,18 +79,13 @@ const devtoolsPlugin = (inlineOptions = {}) => {
             routes
           };
         },
-        async config() {
+        config() {
+          var _api_useConfigContext_devtools;
+          const config = (_api_useConfigContext_devtools = api.useConfigContext().devtools) !== null && _api_useConfigContext_devtools !== void 0 ? _api_useConfigContext_devtools : {};
+          Object.assign(ctx, (0, import_config.resolveContext)(ctx, config));
           import_utils.logger.info(`${ctx.def.name.formalName} DevTools is enabled`);
           const swProxyEntry = require.resolve("@modern-js/devtools-client/sw-proxy");
-          const clientOptions = import_lodash.default.pick(ctx, [
-            "def",
-            "endpoint",
-            "dataSource"
-          ]);
-          Object.assign(clientOptions, {
-            __keep: true
-          });
-          const serializedOptions = JSON.stringify(clientOptions);
+          const serializedOptions = JSON.stringify(ctx);
           const tags = [
             {
               tag: "script",
@@ -182,20 +140,11 @@ const devtoolsPlugin = (inlineOptions = {}) => {
               devServer: {
                 proxy: {
                   [import_node.ROUTE_BASENAME]: {
-                    target: `http://127.0.0.1:${httpServer.port}`,
+                    target: `http://localhost:${httpServer.port}`,
                     pathRewrite: {
                       [`^${import_node.ROUTE_BASENAME}`]: ""
                     },
-                    ws: true,
-                    onProxyReq(proxyReq, req) {
-                      const addrInfo = req.socket.address();
-                      if ("address" in addrInfo) {
-                        const { address } = addrInfo;
-                        proxyReq.setHeader("X-Forwarded-For", address);
-                      } else {
-                        proxyReq.removeHeader("X-Forwarded-For");
-                      }
-                    }
+                    ws: true
                   }
                 }
               }
@@ -208,71 +157,24 @@ const devtoolsPlugin = (inlineOptions = {}) => {
 };
 var cli_default = devtoolsPlugin;
 const setupHttpServer = async () => {
-  const app = new import_hono.Hono();
   const port = await (0, import_utils.getPort)(8782, {
     slient: true
   });
   const clientServeDir = import_path.default.resolve(require.resolve("@modern-js/devtools-client/package.json"), "../dist");
-  const handleCookieApi = async (c) => {
-    const raw = c.req.header("Cookie");
-    const { parse } = await import("cookie-es");
-    const cookies = raw ? parse(raw) : {};
-    const body = await c.req.json().catch(() => null);
-    if (body === null || body === void 0 ? void 0 : body.setCookies) {
-      const { setCookies } = body;
-      (0, import_assert.default)(typeof setCookies === "object", "setCookies should be object");
-      for (const [k, v] of Object.entries(setCookies)) {
-        (0, import_assert.default)(typeof v === "string");
-        const expires = new Date(Date.now() + 30 * 24 * 36e5).toUTCString();
-        cookies[k] = v;
-        c.header("Set-Cookie", `${k}=${v}; Expires=${expires}; Path=/`, {
-          append: true
-        });
-      }
-    }
-    return c.json({
-      cookies
-    });
-  };
-  app.get("/api/cookies", handleCookieApi);
-  app.post("/api/cookies", handleCookieApi);
-  app.use(
-    "/static/*",
-    // Workaround for https://github.com/honojs/node-server/blob/dd0e0cd160b0b8f18abbcb28c5f5c39b72105d98/src/serve-static.ts#L56
-    (0, import_serve_static.serveStatic)({
-      root: import_path.default.relative(process.cwd(), clientServeDir)
-    })
-  );
-  app.get(":filename{.+\\.hot-update\\.\\w+$}", async (c) => {
-    if (process.env.NODE_ENV !== "development") {
-      return c.text("Not found", 404);
-    }
-    const filename = c.req.param("filename");
-    const target = new import_url.URL(filename, "http://127.0.0.1:8780");
-    const { body, headers, status } = await fetch(target.href);
-    const newResp = c.newResponse(body, {
-      headers,
-      status
-    });
-    if (newResp.headers.get("content-encoding") === "gzip") {
-      newResp.headers.delete("content-encoding");
-    }
-    return newResp;
-  });
-  app.get("*", async (c) => {
-    const filename = import_path.default.resolve(clientServeDir, "html/client/index.html");
-    const content = await import_utils.fs.readFile(filename, "utf-8");
-    return c.html(content);
-  });
-  const instance = (0, import_node_server.serve)({
-    fetch: app.fetch,
-    port,
-    hostname: "127.0.0.1",
-    serverOptions: {
-      allowHTTP1: true
-    }
+  const serveMiddleware = (0, import_serve_static.default)(clientServeDir);
+  const instance = import_http.default.createServer((req, res) => {
+    const usePageNotFound = () => {
+      res.write("404");
+      res.statusCode = 404;
+      res.end();
+    };
+    const useMainRoute = () => {
+      req.url = "/html/client/index.html";
+      serveMiddleware(req, res, usePageNotFound);
+    };
+    serveMiddleware(req, res, useMainRoute);
   });
-  (0, import_assert.default)(instance instanceof import_http.default.Server, "instance should be http.Server");
+  instance.listen(port);
   return {
     instance,
     port

package/dist/config.d.ts

@@ -0,0 +1,11 @@
+import { ClientDefinition } from '@modern-js/devtools-kit/node';
+import type { RequiredDeep } from 'type-fest';
+export interface DevtoolsPluginOptions {
+    enable?: boolean;
+    endpoint?: string;
+    dataSource?: string;
+}
+export interface DevtoolsContext extends RequiredDeep<DevtoolsPluginOptions> {
+    def: ClientDefinition;
+}
+export declare const resolveContext: (...sources: Partial<DevtoolsContext>[]) => DevtoolsContext;

package/dist/{options.js → config.js}

@@ -16,21 +16,22 @@ var __copyProps = (to, from, except, desc) => {
   return to;
 };
 var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
-var options_exports = {};
-__export(options_exports, {
-  resolveContext: () => resolveContext,
-  updateContext: () => updateContext
+var config_exports = {};
+__export(config_exports, {
+  resolveContext: () => resolveContext
 });
-module.exports = __toCommonJS(options_exports);
+module.exports = __toCommonJS(config_exports);
 var import_node = require("@modern-js/devtools-kit/node");
 const resolveContext = (...sources) => {
   const ret = {
     enable: process.env.NODE_ENV === "development",
     dataSource: `${import_node.ROUTE_BASENAME}/rpc`,
     endpoint: import_node.ROUTE_BASENAME,
-    def: new import_node.ClientDefinition(),
-    storagePresets: []
+    def: new import_node.ClientDefinition()
   };
+  Object.assign(ret, {
+    __keep: true
+  });
   for (const opts of sources) {
     var _opts_enable;
     ret.enable = (_opts_enable = opts.enable) !== null && _opts_enable !== void 0 ? _opts_enable : ret.enable;
@@ -40,15 +41,10 @@ const resolveContext = (...sources) => {
     ret.endpoint = (_opts_endpoint = opts.endpoint) !== null && _opts_endpoint !== void 0 ? _opts_endpoint : ret.endpoint;
     var _opts_def;
     ret.def = (_opts_def = opts.def) !== null && _opts_def !== void 0 ? _opts_def : ret.def;
-    opts.storagePresets && ret.storagePresets.push(...opts.storagePresets);
   }
   return ret;
 };
-const updateContext = (context, ...sources) => {
-  Object.assign(context, resolveContext(context, ...sources));
-};
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
-  resolveContext,
-  updateContext
+  resolveContext
 });

package/dist/rpc/index.d.ts

@@ -1,11 +1,11 @@
-import { type ClientFunctions, type ServerFunctions, DevtoolsContext } from '@modern-js/devtools-kit/node';
+import { ClientDefinition, type ClientFunctions, type ServerFunctions } from '@modern-js/devtools-kit/node';
 import type { RsbuildPlugin } from '@modern-js/uni-builder';
 import { CliPluginAPI, InjectedHooks } from '../types';
 import { SocketServer } from '../utils/socket';
 export interface SetupClientConnectionOptions {
     api: CliPluginAPI;
     server: SocketServer;
-    ctx: DevtoolsContext;
+    def: ClientDefinition;
 }
 export declare const setupClientConnection: (options: SetupClientConnectionOptions) => Promise<{
     client: import("birpc").BirpcReturn<ClientFunctions, ServerFunctions>;

package/dist/rpc/index.js

@@ -31,96 +31,15 @@ __export(rpc_exports, {
   setupClientConnection: () => setupClientConnection
 });
 module.exports = __toCommonJS(rpc_exports);
-var import_path = __toESM(require("path"));
-var import_buffer = require("buffer");
-var import_node = require("@modern-js/devtools-kit/node");
 var import_lodash = __toESM(require("@modern-js/utils/lodash"));
+var import_node = require("@modern-js/devtools-kit/node");
 var import_birpc = require("birpc");
 var flatted = __toESM(require("flatted"));
-var import_valtio = require("valtio");
-var import_utils = require("@modern-js/utils");
+var import_p_defer = __toESM(require("p-defer"));
 var import_module = require("../utils/module");
-var import_state = require("../state");
-const resolveDependencies = async (rootPath) => {
-  const ret = {};
-  const resolveExprs = {
-    react: [
-      rootPath,
-      "react/package.json"
-    ],
-    "@modern-js/app-tools": [
-      rootPath,
-      "@modern-js/app-tools/package.json"
-    ],
-    "@edenx/app-tools": [
-      rootPath,
-      "@edenx/app-tools/package.json"
-    ],
-    webpack: [
-      rootPath,
-      "@modern-js/app-tools",
-      "@modern-js/uni-builder",
-      "@rsbuild/webpack",
-      "webpack/package.json"
-    ],
-    "@rspack/core": [
-      rootPath,
-      "@modern-js/uni-builder",
-      "@rsbuild/core",
-      "@rspack/core/package.json"
-    ],
-    "@rsdoctor/rspack-plugin": [
-      rootPath,
-      "@rsdoctor/rspack-plugin/package.json"
-    ],
-    "@rsdoctor/webpack-plugin": [
-      rootPath,
-      "@rsdoctor/webpack-plugin/package.json"
-    ],
-    "@web-doctor/webpack-plugin": [
-      rootPath,
-      "@web-doctor/webpack-plugin/package.json"
-    ],
-    "@web-doctor/rspack-plugin": [
-      rootPath,
-      "@web-doctor/rspack-plugin/package.json"
-    ],
-    "@web-doctor/webpack-plugin(builder)": [
-      rootPath,
-      "@edenx/builder-plugin-web-doctor",
-      "@web-doctor/webpack-plugin/package.json"
-    ],
-    "@web-doctor/rspack-plugin(builder)": [
-      rootPath,
-      "@edenx/builder-plugin-web-doctor",
-      "@web-doctor/rspack-plugin/package.json"
-    ],
-    "@rsdoctor/core": [
-      rootPath,
-      "@rsdoctor/core/package.json"
-    ]
-  };
-  for (const [name, expr] of Object.entries(resolveExprs)) {
-    try {
-      ret[name] = (0, import_module.requireModule)(expr).version;
-    } catch {
-    }
-  }
-  return ret;
-};
-const getDoctorOverview = async (ctx) => {
-  const manifestPath = await (0, import_node.findManifest)(ctx.distDirectory);
-  const json = await (0, import_node.parseManifest)(require(manifestPath));
-  return {
-    numModules: json.data.moduleGraph.modules.length,
-    numChunks: json.data.chunkGraph.chunks.length,
-    numPackages: json.data.packageGraph.packages.length,
-    summary: json.data.summary,
-    errors: json.data.errors
-  };
-};
 const setupClientConnection = async (options) => {
-  const { api, server, ctx } = options;
+  const { api, server, def } = options;
+  const _fileSystemRoutesMap = {};
   let handleMessage = null;
   const onceConnection = new Promise((resolve) => {
     server.on("connection", (ws) => {
@@ -128,106 +47,151 @@ const setupClientConnection = async (options) => {
       ws.on("message", (data, isBinary) => handleMessage === null || handleMessage === void 0 ? void 0 : handleMessage(data, isBinary));
     });
   });
-  if ("resolve" in import_state.$resolvers.context) {
-    import_state.$resolvers.context.resolve(ctx);
-  }
-  import_state.$state.context = ctx;
-  (0, import_valtio.subscribe)(import_state.$state, (ops) => {
-    clientConn.applyStateOperations.asEvent(ops);
-  });
-  const validateSafeToOpen = (filename) => {
-    const { appDirectory } = api.useAppContext();
-    const resolved = import_path.default.resolve(appDirectory, filename);
-    for (const preset of ctx.storagePresets) {
-      if (import_path.default.resolve(appDirectory, preset.filename) === resolved) {
-        return true;
+  const deferred = {
+    prepare: (0, import_p_defer.default)(),
+    builder: {
+      context: (0, import_p_defer.default)(),
+      config: {
+        resolved: (0, import_p_defer.default)(),
+        transformed: (0, import_p_defer.default)()
       }
-    }
-    return false;
+    },
+    bundler: {
+      config: {
+        resolved: (0, import_p_defer.default)(),
+        transformed: (0, import_p_defer.default)()
+      }
+    },
+    compileTimeCost: (0, import_p_defer.default)()
   };
   const serverFunctions = {
-    echo(content) {
-      return content;
+    async getFrameworkConfig() {
+      await deferred.prepare.promise;
+      return api.useConfigContext();
     },
-    async pullExportedState() {
-      (0, import_node.extractSettledOperations)(import_state.$state).then((ops) => {
-        clientConn.applyStateOperations.asEvent(ops);
-      });
-      return import_state.$state;
+    async getTransformedFrameworkConfig() {
+      await deferred.prepare.promise;
+      return api.useResolvedConfigContext();
     },
-    async createTemporaryStoragePreset() {
-      var _config;
-      const appCtx = api.useAppContext();
-      const basename = `${ctx.def.name.shortName}.runtime.json`;
-      const filename = import_path.default.resolve(appCtx.appDirectory, basename);
-      const id = (0, import_utils.nanoid)();
-      const name = `New Preset ${id.slice(0, 6)}`;
-      const config = {};
-      if (await import_utils.fs.pathExists(filename)) {
-        Object.assign(config, await import_utils.fs.readJSON(filename));
-      }
-      const newPreset = {
-        name,
-        id,
-        cookie: {},
-        localStorage: {},
-        sessionStorage: {}
-      };
-      (_config = config).storagePresets || (_config.storagePresets = []);
-      config.storagePresets.push(newPreset);
-      await import_utils.fs.outputJSON(filename, config, {
-        spaces: 2
-      });
-      return newPreset;
+    async getBuilderConfig() {
+      return deferred.builder.config.resolved.promise;
     },
-    async pasteStoragePreset(target) {
-      var _config;
-      const { default: clipboardy } = await import("clipboardy");
-      const raw = clipboardy.readSync();
-      const HEAD = `data:application/json;base64,`;
-      if (!raw.startsWith(HEAD)) {
-        throw new Error("Failed to parse data URL");
-      }
-      const encoded = raw.slice(HEAD.length);
-      const preset = JSON.parse(import_buffer.Buffer.from(encoded, "base64").toString("utf-8"));
-      if (typeof preset !== "object" || preset === null) {
-        throw new Error("Failed to parse data URL");
-      }
-      if (typeof preset.name !== "string") {
-        throw new Error("Failed to parse data URL");
-      }
-      const appCtx = api.useAppContext();
-      const filename = import_path.default.resolve(appCtx.appDirectory, target.filename);
-      const config = {};
-      if (await import_utils.fs.pathExists(filename)) {
-        Object.assign(config, await import_utils.fs.readJSON(filename));
-      }
-      (_config = config).storagePresets || (_config.storagePresets = []);
-      const diff = import_lodash.default.pick(preset, [
-        "cookie",
-        "localStorage",
-        "sessionStorage"
+    async getTransformedBuilderConfig() {
+      return deferred.builder.config.transformed.promise;
+    },
+    async getBundlerConfigs() {
+      return deferred.bundler.config.resolved.promise;
+    },
+    async getTransformedBundlerConfigs() {
+      return deferred.bundler.config.transformed.promise;
+    },
+    async getAppContext() {
+      await deferred.prepare.promise;
+      const ctx = {
+        ...api.useAppContext()
+      };
+      return import_lodash.default.omit(ctx, [
+        "builder",
+        "serverInternalPlugins"
       ]);
-      const matched = import_lodash.default.find(config.storagePresets, {
-        id: target.id
-      });
-      if (matched) {
-        import_lodash.default.merge(matched, diff);
-      } else {
-        config.storagePresets.push(preset);
-      }
-      await import_utils.fs.outputJSON(filename, config, {
-        spaces: 2
-      });
     },
-    async open(filename) {
-      const name = import_path.default.resolve(api.useAppContext().appDirectory, filename);
-      const validated = validateSafeToOpen(name);
-      if (!validated) {
-        throw new Error("Failed to validate the file.");
+    async getFileSystemRoutes(entryName) {
+      var _fileSystemRoutesMap_entryName;
+      return (_fileSystemRoutesMap_entryName = _fileSystemRoutesMap[entryName]) !== null && _fileSystemRoutesMap_entryName !== void 0 ? _fileSystemRoutesMap_entryName : [];
+    },
+    async getBuilderContext() {
+      const ctx = await deferred.builder.context.promise;
+      return ctx;
+    },
+    async getDependencies() {
+      const ctx = await deferred.builder.context.promise;
+      const ret = {};
+      const resolveExprs = {
+        react: [
+          ctx.rootPath,
+          "react/package.json"
+        ],
+        "@modern-js/app-tools": [
+          ctx.rootPath,
+          "@modern-js/app-tools/package.json"
+        ],
+        "@edenx/app-tools": [
+          ctx.rootPath,
+          "@edenx/app-tools/package.json"
+        ],
+        webpack: [
+          ctx.rootPath,
+          "@modern-js/app-tools",
+          "@modern-js/uni-builder",
+          "@rsbuild/webpack",
+          "webpack/package.json"
+        ],
+        "@rspack/core": [
+          ctx.rootPath,
+          "@modern-js/uni-builder",
+          "@rsbuild/core",
+          "@rspack/core/package.json"
+        ],
+        "@rsdoctor/rspack-plugin": [
+          ctx.rootPath,
+          "@rsdoctor/rspack-plugin/package.json"
+        ],
+        "@rsdoctor/webpack-plugin": [
+          ctx.rootPath,
+          "@rsdoctor/webpack-plugin/package.json"
+        ],
+        "@web-doctor/webpack-plugin": [
+          ctx.rootPath,
+          "@web-doctor/webpack-plugin/package.json"
+        ],
+        "@web-doctor/rspack-plugin": [
+          ctx.rootPath,
+          "@web-doctor/rspack-plugin/package.json"
+        ],
+        "@web-doctor/webpack-plugin(builder)": [
+          ctx.rootPath,
+          "@edenx/builder-plugin-web-doctor",
+          "@web-doctor/webpack-plugin/package.json"
+        ],
+        "@web-doctor/rspack-plugin(builder)": [
+          ctx.rootPath,
+          "@edenx/builder-plugin-web-doctor",
+          "@web-doctor/rspack-plugin/package.json"
+        ],
+        "@rsdoctor/core": [
+          ctx.rootPath,
+          "@rsdoctor/core/package.json"
+        ]
+      };
+      for (const [name, expr] of Object.entries(resolveExprs)) {
+        try {
+          ret[name] = (0, import_module.requireModule)(expr).version;
+        } catch {
+        }
       }
-      const { default: open } = await import("open");
-      await open(name);
+      return ret;
+    },
+    async getCompileTimeCost() {
+      return deferred.compileTimeCost.promise;
+    },
+    async getClientDefinition() {
+      return def;
+    },
+    async getDoctorOverview() {
+      const ctx = api.useAppContext();
+      const manifestPath = await (0, import_node.findManifest)(ctx.distDirectory);
+      const json = await (0, import_node.parseManifest)(require(manifestPath));
+      const data = {
+        numModules: json.data.moduleGraph.modules.length,
+        numChunks: json.data.chunkGraph.chunks.length,
+        numPackages: json.data.packageGraph.packages.length,
+        summary: json.data.summary,
+        errors: json.data.errors
+      };
+      return data;
+    },
+    echo(content) {
+      return content;
     }
   };
   const clientRpcOptions = {
@@ -235,27 +199,16 @@ const setupClientConnection = async (options) => {
     on: (cb) => handleMessage = cb,
     serialize: (v) => flatted.stringify([
       v
-    ], import_node.replacer),
-    deserialize: (v) => {
-      const msg = flatted.parse(v.toString(), import_node.reviver)[0];
-      return msg;
-    }
+    ]),
+    deserialize: (v) => flatted.parse(v.toString())[0]
   };
   const clientConn = (0, import_birpc.createBirpc)(serverFunctions, clientRpcOptions);
   const hooks = {
     prepare() {
-      const frameworkContext = {
-        ...api.useAppContext(),
-        builder: null,
-        serverInternalPlugins: null
-      };
-      import_state.$resolvers.framework.context.resolve(frameworkContext);
-      import_state.$resolvers.framework.config.resolved.resolve(api.useConfigContext());
-      import_state.$resolvers.framework.config.transformed.resolve(api.useResolvedConfigContext());
-      getDoctorOverview(frameworkContext).then((doctor) => import_state.$resolvers.doctor.resolve(doctor)).catch(() => import_state.$resolvers.doctor.resolve(void 0));
+      deferred.prepare.resolve();
     },
     modifyFileSystemRoutes({ entrypoint, routes }) {
-      import_state.$state.fileSystemRoutes[entrypoint.entryName] = import_lodash.default.cloneDeep(routes);
+      _fileSystemRoutesMap[entrypoint.entryName] = import_lodash.default.cloneDeep(routes);
       return {
         entrypoint,
         routes
@@ -265,20 +218,17 @@ const setupClientConnection = async (options) => {
   const builderPlugin = {
     name: "builder-plugin-devtools",
     setup(api2) {
-      import_state.$resolvers.builder.context.resolve(api2.context);
-      resolveDependencies(api2.context.rootPath).then((deps) => {
-        import_state.$state.dependencies = deps;
-      });
+      deferred.builder.context.resolve(import_lodash.default.cloneDeep(api2.context));
       api2.modifyBundlerChain(() => {
-        import_state.$resolvers.builder.config.resolved.resolve(import_lodash.default.cloneDeep(api2.getRsbuildConfig()));
-        import_state.$resolvers.builder.config.transformed.resolve(import_lodash.default.cloneDeep(api2.getNormalizedConfig()));
+        deferred.builder.config.resolved.resolve(import_lodash.default.cloneDeep(api2.getRsbuildConfig()));
+        deferred.builder.config.transformed.resolve(import_lodash.default.cloneDeep(api2.getNormalizedConfig()));
       });
       const expectBundlerNum = import_lodash.default.castArray(api2.context.targets).length;
       const bundlerConfigs = [];
       const handleBundlerConfig = (config) => {
         bundlerConfigs.push(config);
         if (bundlerConfigs.length >= expectBundlerNum) {
-          import_state.$state.bundler.configs.resolved = import_lodash.default.cloneDeep(bundlerConfigs);
+          deferred.bundler.config.resolved.resolve(import_lodash.default.cloneDeep(bundlerConfigs));
         }
       };
       if (api2.context.bundlerType === "webpack") {
@@ -291,21 +241,17 @@ const setupClientConnection = async (options) => {
         });
       }
       api2.onBeforeCreateCompiler(({ bundlerConfigs: bundlerConfigs2 }) => {
-        import_state.$resolvers.bundler.configs.transformed.resolve(import_lodash.default.cloneDeep(bundlerConfigs2));
+        deferred.bundler.config.transformed.resolve(import_lodash.default.cloneDeep(bundlerConfigs2));
       });
       let buildStartedAt = NaN;
       api2.onAfterCreateCompiler(() => {
         buildStartedAt = Date.now();
       });
       api2.onDevCompileDone(() => {
-        import_state.$resolvers.performance.resolve({
-          compileDuration: Date.now() - buildStartedAt
-        });
+        deferred.compileTimeCost.resolve(Date.now() - buildStartedAt);
       });
       api2.onAfterBuild(() => {
-        import_state.$resolvers.performance.resolve({
-          compileDuration: Date.now() - buildStartedAt
-        });
+        deferred.compileTimeCost.resolve(Date.now() - buildStartedAt);
       });
     }
   };

package/package.json

@@ -15,7 +15,7 @@
     "modern",
     "modern.js"
   ],
-  "version": "0.0.0-next-20240522085356",
+  "version": "0.0.0-next-20240522113137",
   "jsnext:source": "./src/index.ts",
   "types": "./dist/index.d.ts",
   "main": "./dist/index.js",
@@ -43,38 +43,34 @@
     }
   },
   "dependencies": {
-    "@hono/node-server": "^1.8.2",
     "birpc": "0.2.13",
-    "clipboardy": "^4.0.0",
-    "cookie-es": "^1.0.0",
     "flatted": "^3.2.9",
-    "hono": "^3.12.2",
-    "open": "^10.1.0",
+    "serve-static": "^1.14.1",
     "p-defer": "^3.0.0",
-    "ufo": "^1.3.0",
-    "valtio": "^1.11.1",
     "ws": "^8.13.0",
-    "@modern-js/devtools-client": "0.0.0-next-20240522085356",
-    "@modern-js/utils": "0.0.0-next-20240522085356",
-    "@modern-js/devtools-kit": "0.0.0-next-20240522085356"
+    "ufo": "^1.3.0",
+    "@modern-js/devtools-kit": "0.0.0-next-20240522113137",
+    "@modern-js/devtools-client": "0.0.0-next-20240522113137",
+    "@modern-js/utils": "0.0.0-next-20240522113137"
   },
   "devDependencies": {
+    "@types/serve-static": "^1.13.10",
     "@swc/helpers": "0.5.3",
     "@types/node": "^14",
     "@types/ws": "^8.5.5",
     "type-fest": "^4.1.0",
     "typescript": "^5",
-    "@modern-js/app-tools": "0.0.0-next-20240522085356",
-    "@modern-js/core": "0.0.0-next-20240522085356",
-    "@modern-js/module-tools": "0.0.0-next-20240522085356",
-    "@modern-js/runtime": "0.0.0-next-20240522085356",
-    "@modern-js/uni-builder": "0.0.0-next-20240522085356",
-    "@scripts/build": "0.0.0-next-20240522085356",
-    "@modern-js/types": "0.0.0-next-20240522085356",
-    "@modern-js/server-core": "0.0.0-next-20240522085356"
+    "@modern-js/app-tools": "0.0.0-next-20240522113137",
+    "@modern-js/core": "0.0.0-next-20240522113137",
+    "@modern-js/module-tools": "0.0.0-next-20240522113137",
+    "@modern-js/types": "0.0.0-next-20240522113137",
+    "@modern-js/runtime": "0.0.0-next-20240522113137",
+    "@modern-js/server-core": "0.0.0-next-20240522113137",
+    "@modern-js/uni-builder": "0.0.0-next-20240522113137",
+    "@scripts/build": "0.0.0-next-20240522113137"
   },
   "peerDependencies": {
-    "@modern-js/runtime": "0.0.0-next-20240522085356"
+    "@modern-js/runtime": "0.0.0-next-20240522113137"
   },
   "peerDependenciesMeta": {
     "@modern-js/runtime": {

package/dist/options.d.ts

@@ -1,8 +0,0 @@
-import { DevtoolsContext } from '@modern-js/devtools-kit/node';
-export interface DevtoolsPluginOptions {
-    enable?: boolean;
-    endpoint?: string;
-    dataSource?: string;
-}
-export declare const resolveContext: (...sources: Partial<DevtoolsContext>[]) => DevtoolsContext;
-export declare const updateContext: (context: DevtoolsContext, ...sources: Partial<DevtoolsContext>[]) => void;

package/dist/state.d.ts

@@ -1,4 +0,0 @@
-import { ServerExportedStateResolvers } from '@modern-js/devtools-kit/node';
-export declare const $serverExportedState: import("@modern-js/devtools-kit/node").ServerExportedStateResult;
-export declare const $resolvers: ServerExportedStateResolvers;
-export declare const $state: import("@modern-js/devtools-kit/node").ServerExportedState;

package/dist/state.js

@@ -1,36 +0,0 @@
-"use strict";
-var __defProp = Object.defineProperty;
-var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
-var __getOwnPropNames = Object.getOwnPropertyNames;
-var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __export = (target, all) => {
-  for (var name in all)
-    __defProp(target, name, { get: all[name], enumerable: true });
-};
-var __copyProps = (to, from, except, desc) => {
-  if (from && typeof from === "object" || typeof from === "function") {
-    for (let key of __getOwnPropNames(from))
-      if (!__hasOwnProp.call(to, key) && key !== except)
-        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
-  }
-  return to;
-};
-var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
-var state_exports = {};
-__export(state_exports, {
-  $resolvers: () => $resolvers,
-  $serverExportedState: () => $serverExportedState,
-  $state: () => $state
-});
-module.exports = __toCommonJS(state_exports);
-var import_valtio = require("valtio");
-var import_node = require("@modern-js/devtools-kit/node");
-const $serverExportedState = (0, import_node.createServerExportedState)();
-const $resolvers = $serverExportedState.resolvers;
-const $state = (0, import_valtio.proxy)($serverExportedState.state);
-// Annotate the CommonJS export names for ESM import in node:
-0 && (module.exports = {
-  $resolvers,
-  $serverExportedState,
-  $state
-});

package/dist/types/common.js

@@ -1,16 +0,0 @@
-"use strict";
-var __defProp = Object.defineProperty;
-var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
-var __getOwnPropNames = Object.getOwnPropertyNames;
-var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __copyProps = (to, from, except, desc) => {
-  if (from && typeof from === "object" || typeof from === "function") {
-    for (let key of __getOwnPropNames(from))
-      if (!__hasOwnProp.call(to, key) && key !== except)
-        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
-  }
-  return to;
-};
-var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
-var common_exports = {};
-module.exports = __toCommonJS(common_exports);

package/dist/types/config.d.ts

@@ -1,4 +0,0 @@
-import { StoragePresetWithIdent } from '@modern-js/devtools-kit/node';
-export interface DevtoolsConfig {
-    storagePresets?: StoragePresetWithIdent[];
-}

package/dist/types/config.js

@@ -1,16 +0,0 @@
-"use strict";
-var __defProp = Object.defineProperty;
-var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
-var __getOwnPropNames = Object.getOwnPropertyNames;
-var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __copyProps = (to, from, except, desc) => {
-  if (from && typeof from === "object" || typeof from === "function") {
-    for (let key of __getOwnPropNames(from))
-      if (!__hasOwnProp.call(to, key) && key !== except)
-        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
-  }
-  return to;
-};
-var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
-var config_exports = {};
-module.exports = __toCommonJS(config_exports);

package/dist/types/index.d.ts

@@ -1,2 +0,0 @@
-export type * from './common';
-export type * from './config';

package/dist/utils/config.d.ts

@@ -1,8 +0,0 @@
-import { DevtoolsContext, StoragePresetContext } from '@modern-js/devtools-kit';
-export declare function getConfigFilenames(dir?: string): string[];
-/** Resolve all config files from target directory upward to the root path. */
-export declare function resolveConfigFiles(dir?: string): Promise<string[]>;
-export declare function loadConfigFile(filename: string): Promise<{
-    storagePresets: StoragePresetContext[];
-} | null>;
-export declare function loadConfigFiles(dir?: string): Promise<Partial<DevtoolsContext>[] | null>;

package/dist/utils/config.js

@@ -1,112 +0,0 @@
-"use strict";
-var __create = Object.create;
-var __defProp = Object.defineProperty;
-var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
-var __getOwnPropNames = Object.getOwnPropertyNames;
-var __getProtoOf = Object.getPrototypeOf;
-var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __export = (target, all) => {
-  for (var name in all)
-    __defProp(target, name, { get: all[name], enumerable: true });
-};
-var __copyProps = (to, from, except, desc) => {
-  if (from && typeof from === "object" || typeof from === "function") {
-    for (let key of __getOwnPropNames(from))
-      if (!__hasOwnProp.call(to, key) && key !== except)
-        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
-  }
-  return to;
-};
-var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
-  // If the importer is in node compatibility mode or this is not an ESM
-  // file that has been converted to a CommonJS file using a Babel-
-  // compatible transform (i.e. "__esModule" has not been set), then set
-  // "default" to the CommonJS "module.exports" for node compatibility.
-  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
-  mod
-));
-var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
-var config_exports = {};
-__export(config_exports, {
-  getConfigFilenames: () => getConfigFilenames,
-  loadConfigFile: () => loadConfigFile,
-  loadConfigFiles: () => loadConfigFiles,
-  resolveConfigFiles: () => resolveConfigFiles
-});
-module.exports = __toCommonJS(config_exports);
-var import_path = __toESM(require("path"));
-var import_fs_extra = __toESM(require("@modern-js/utils/fs-extra"));
-var import_utils = require("@modern-js/utils");
-const CONFIG_FILENAME = "modern.runtime.json";
-function getConfigFilenames(dir = process.cwd()) {
-  const files = [];
-  let curr = dir;
-  while (import_path.default.dirname(curr) !== curr) {
-    files.push(import_path.default.join(curr, CONFIG_FILENAME));
-    curr = import_path.default.dirname(curr);
-  }
-  return files;
-}
-async function resolveConfigFiles(dir = process.cwd()) {
-  const files = getConfigFilenames(dir);
-  const ret = [];
-  await Promise.all(files.map(async (file) => await import_fs_extra.default.pathExists(file) && ret.push(file)));
-  return ret;
-}
-async function loadConfigFile(filename) {
-  const storagePresets = [];
-  try {
-    const config = await import_fs_extra.default.readJSON(filename);
-    config.storagePresets && storagePresets.push(...config.storagePresets);
-  } catch (e) {
-    import_utils.logger.error(e);
-    return null;
-  }
-  const presets = [];
-  let _validated = true;
-  for (const preset of storagePresets) {
-    if (typeof preset.id !== "string") {
-      preset.id = (0, import_utils.nanoid)();
-      _validated = false;
-    }
-    presets.push(preset);
-  }
-  if (!_validated) {
-    await import_fs_extra.default.outputJSON(filename, {
-      storagePresets: presets
-    }, {
-      spaces: 2
-    });
-    return null;
-  }
-  const ret = [];
-  for (const preset of presets) {
-    ret.push({
-      ...preset,
-      filename
-    });
-  }
-  return {
-    storagePresets: ret
-  };
-}
-async function loadConfigFiles(dir = process.cwd()) {
-  const filenames = await resolveConfigFiles(dir);
-  const resolved = await Promise.all(filenames.map(loadConfigFile));
-  const ret = [];
-  for (const config of resolved) {
-    if (config) {
-      ret.push(config);
-    } else {
-      return null;
-    }
-  }
-  return ret;
-}
-// Annotate the CommonJS export names for ESM import in node:
-0 && (module.exports = {
-  getConfigFilenames,
-  loadConfigFile,
-  loadConfigFiles,
-  resolveConfigFiles
-});