@nuxt/devtools 4.0.0-alpha.1 → 4.0.0-alpha.11

package/README.md

@@ -44,21 +44,100 @@ export default defineNuxtConfig({
 })
 ```
 
+### Opting in to v4.0
+
+Nuxt DevTools v4.0 is currently in alpha. Since Nuxt ships with a built-in version of DevTools, you can opt-in to v4.0 by using package manager resolutions to override the bundled version:
+
+<details>
+<summary>npm</summary>
+
+```json
+{
+  "overrides": {
+    "@nuxt/devtools": "npm:@nuxt/devtools-nightly@latest"
+  }
+}
+```
+
+</details>
+
+<details>
+<summary>yarn</summary>
+
+```json
+{
+  "resolutions": {
+    "@nuxt/devtools": "npm:@nuxt/devtools-nightly@latest"
+  }
+}
+```
+
+</details>
+
+<details>
+<summary>pnpm</summary>
+
+```json
+{
+  "pnpm": {
+    "overrides": {
+      "@nuxt/devtools": "npm:@nuxt/devtools-nightly@latest"
+    }
+  }
+}
+```
+
+</details>
+
+Remove lockfile (`package-lock.json`, `yarn.lock`, or `pnpm-lock.yaml`) and reinstall dependencies.
+
 ### Nightly Release Channel
 
 Similar to [Nuxt's Nightly Channel](https://nuxt.com/docs/guide/going-further/nightly-release-channel), DevTools also offers a nightly release channel, that automatically releases for every commit to `main` branch.
 
-You can opt-in to the nightly release channel by running:
+You can opt-in to the nightly release channel by using package manager resolutions:
+
+<details>
+<summary>npm</summary>
 
-```diff
+```json
 {
-  "devDependencies": {
---    "@nuxt/devtools": "^0.1.0"
-++    "@nuxt/devtools": "npm:@nuxt/devtools-nightly@latest"
+  "overrides": {
+    "@nuxt/devtools": "npm:@nuxt/devtools-nightly@latest"
   }
 }
 ```
 
+</details>
+
+<details>
+<summary>yarn</summary>
+
+```json
+{
+  "resolutions": {
+    "@nuxt/devtools": "npm:@nuxt/devtools-nightly@latest"
+  }
+}
+```
+
+</details>
+
+<details>
+<summary>pnpm</summary>
+
+```json
+{
+  "pnpm": {
+    "overrides": {
+      "@nuxt/devtools": "npm:@nuxt/devtools-nightly@latest"
+    }
+  }
+}
+```
+
+</details>
+
 Remove lockfile (`package-lock.json`, `yarn.lock`, or `pnpm-lock.yaml`) and reinstall dependencies.
 
 ### Module Options
@@ -71,8 +150,8 @@ export default defineNuxtConfig({
   devtools: {
     // Enable devtools (default: true)
     enabled: true,
-    // VS Code Server options
-    vscode: {},
+    // Coder code-server options (enabled by default)
+    codeServer: {},
     // ...other options
   }
 })
@@ -98,6 +177,8 @@ Nuxt DevTools collects anonymous telemetry data about general usage. This helps
 
 Nuxt DevTools' telemetry data is piped through [Nuxt Telemetry](https://github.com/nuxt/telemetry), meaning that Nuxt DevTools will respect your local and global Nuxt Telemetry settings. You can also opt-out Nuxt DevTools' telemetry in the Nuxt DevTools settings.
 
+Nuxt DevTools also respects the [`DO_NOT_TRACK`](https://donottrack.sh/) environment variable convention — set `DO_NOT_TRACK=1` in your environment to disable Nuxt DevTools telemetry regardless of any other setting.
+
 The data we collect is completely anonymous, not traceable to the source (using hash+seed), and only meaningful in aggregate form. No data we collect is personally identifiable or trackable.
 
 ### Events

package/dist/chunks/analyze-build.mjs

@@ -1,8 +1,38 @@
 import { addVitePlugin } from '@nuxt/kit';
 import { resolve, join } from 'pathe';
 import { readdir, lstat } from 'node:fs/promises';
-import { createVitePluginInspect } from './vite-inspect.mjs';
+import { isVitePluginInspectAvailable, createVitePluginInspect } from './vite-inspect.mjs';
 import '@nuxt/devtools-kit';
+import '@vitejs/devtools-kit/node';
+import 'local-pkg';
+import './module-main.mjs';
+import 'node:fs';
+import 'node:os';
+import 'consola/utils';
+import 'sirv';
+import 'vite';
+import '../shared/devtools.BNZC-DT8.mjs';
+import '../dirs.mjs';
+import 'node:path';
+import 'node:url';
+import 'tinyexec';
+import 'tinyglobby';
+import 'image-meta';
+import 'perfect-debounce';
+import 'destr';
+import '../../dist/runtime/shared/hooks.js';
+import 'ohash';
+import 'node:process';
+import 'node:module';
+import 'pkg-types';
+import 'node:assert';
+import 'node:v8';
+import 'node:util';
+import 'magicast';
+import 'magicast/helpers';
+import 'verkit';
+import '@vitejs/devtools-kit/constants';
+import 'unstorage';
 
 async function getFolderSize(dir) {
   const dirents = await readdir(dir, {
@@ -37,7 +67,7 @@ async function getFolderSize(dir) {
 }
 
 async function setup(nuxt, options) {
-  if (options.viteInspect !== false) {
+  if (options.viteInspect !== false && isVitePluginInspectAvailable(nuxt.options.rootDir)) {
     addVitePlugin(
       await createVitePluginInspect({
         build: true,

package/dist/chunks/code-server.mjs

@@ -0,0 +1,74 @@
+import { createCodeServerDevframe } from '@devframes/plugin-code-server';
+import { setupCodeServer } from '@devframes/plugin-code-server/node';
+import { deprecate, onDevtoolsReady, NUXT_DEVTOOLS_GROUP_ID } from '@nuxt/devtools-kit';
+
+const RESERVED_ARGS = ["--auth", "--bind-addr", "--cookie-suffix"];
+const RESERVED_ENV = ["PASSWORD", "HASHED_PASSWORD"];
+function matchesOption(arg, option) {
+  return arg === option || arg.startsWith(`${option}=`);
+}
+function resolveCodeServerOptions(options, rootDir) {
+  const args = options?.args;
+  const reservedArg = args?.find((arg) => RESERVED_ARGS.some((option) => matchesOption(arg, option)));
+  if (reservedArg) {
+    throw new Error(
+      `[Nuxt DevTools] codeServer.args cannot override ${reservedArg.split("=")[0]}. Configure host and cookieSuffix through their dedicated codeServer options; authentication is managed automatically.`
+    );
+  }
+  const env = options?.env;
+  const reservedEnv = RESERVED_ENV.find((key) => Object.hasOwn(env ?? {}, key));
+  if (reservedEnv) {
+    throw new Error(
+      `[Nuxt DevTools] codeServer.env cannot set ${reservedEnv}. Code Server authentication credentials are generated and managed automatically.`
+    );
+  }
+  return {
+    // The 0.7 plugin also knows about Microsoft's serve-web and tunnels. Nuxt
+    // intentionally exposes only Coder code-server for this integration.
+    backend: "code-server",
+    bin: options?.bin,
+    cwd: options?.cwd ?? rootDir,
+    serverPort: options?.serverPort,
+    host: options?.host,
+    args,
+    env,
+    cookieSuffix: options?.cookieSuffix,
+    startTimeout: options?.startTimeout
+  };
+}
+function setup(ctx) {
+  const { nuxt, options } = ctx;
+  if (options.vscode !== void 0) {
+    deprecate(nuxt, "NDT_DEP_0008", {
+      api: "devtools.vscode",
+      replacement: "devtools.codeServer"
+    });
+  }
+  if (options.codeServer?.enabled === false)
+    return;
+  const codeServerOptions = resolveCodeServerOptions(options.codeServer, nuxt.options.rootDir);
+  const definition = createCodeServerDevframe(codeServerOptions);
+  let supervisor;
+  let setupPromise;
+  const mountedDefinition = {
+    ...definition,
+    async setup(devframeCtx) {
+      setupPromise = setupCodeServer(devframeCtx, codeServerOptions);
+      supervisor = await setupPromise;
+    }
+  };
+  nuxt.hook("close", async () => {
+    await setupPromise;
+    supervisor?.dispose();
+  });
+  onDevtoolsReady((kit) => {
+    return kit.install(mountedDefinition, {
+      dock: {
+        groupId: NUXT_DEVTOOLS_GROUP_ID,
+        category: "modules"
+      }
+    });
+  }, nuxt);
+}
+
+export { resolveCodeServerOptions, setup };

package/dist/chunks/data-inspector.mjs

@@ -0,0 +1,82 @@
+import { registerDataSource, createDataInspectorDevframe } from '@devframes/plugin-data-inspector';
+import { onDevtoolsReady, NUXT_DEVTOOLS_GROUP_ID, deprecate } from '@nuxt/devtools-kit';
+
+const captured = {};
+function normalizeViteConfig(config) {
+  return {
+    ...config,
+    environments: Object.fromEntries(
+      Object.entries(config.env ?? {}).map(([key, _]) => {
+        return [key, null];
+      })
+    ),
+    plugins: (config.plugins ?? []).map((i) => {
+      const clone = { ...i };
+      delete clone.api;
+      return clone;
+    }),
+    inlineConfig: null
+  };
+}
+function setup(ctx) {
+  const { nuxt } = ctx;
+  nuxt.hook("nitro:build:before", (nitro) => {
+    captured.nitro = nitro;
+  });
+  nuxt.hook("vite:serverCreated", (server) => {
+    captured.vite = server;
+  });
+  const dataSource = registerDataSource({
+    id: "nuxt:application",
+    title: "Nuxt Application",
+    description: "Live Nuxt, Nitro, and Vite configuration",
+    icon: "i-ph:database-duotone",
+    static: false,
+    data: () => ({
+      nuxt: nuxt.options,
+      nitro: captured.nitro?.options,
+      vite: captured.vite
+    }),
+    queries: [
+      { title: "Overview", query: "", excludeFunctions: true },
+      { title: "Nuxt modules", query: "nuxt.modules", excludeFunctions: true },
+      { title: "Vite plugins", query: "vite.config.plugins", excludeFunctions: true },
+      { title: "Vite config", query: "vite.config", excludeFunctions: true },
+      { title: "Vite environments", query: "vite.environments", excludeFunctions: true },
+      { title: "Nitro routes", query: "nitro.handlers", excludeFunctions: true }
+    ]
+  });
+  nuxt.hook("close", () => {
+    dataSource.unregister();
+    captured.nitro = void 0;
+    captured.vite = void 0;
+  });
+  const definition = createDataInspectorDevframe({ exampleSource: false });
+  onDevtoolsReady((kit) => {
+    return kit.install(definition, {
+      dock: {
+        groupId: NUXT_DEVTOOLS_GROUP_ID,
+        category: "advanced"
+      }
+    });
+  }, nuxt);
+}
+function getServerData(nuxt) {
+  deprecate(nuxt, "NDT_DEP_0009", {
+    api: "getServerData()",
+    replacement: "the Nuxt Application source in the Data Inspector panel"
+  });
+  const config = captured.vite?.config;
+  return {
+    nuxt: nuxt.options,
+    nitro: captured.nitro?.options,
+    vite: {
+      server: config ? normalizeViteConfig(config) : void 0,
+      client: config ? normalizeViteConfig(config) : void 0
+    }
+    // `nuxt.options` is `@nuxt/schema`'s `NuxtOptions` while `NuxtServerData`
+    // pins the structurally-identical `nuxt/schema` one; bridge the two.
+  };
+}
+
+export { getServerData, setup };