@nuxt/devtools-nightly 3.2.4-29563482.f9a1d97 → 4.0.0-29884683.7500671

package/README.md

@@ -24,15 +24,15 @@ Unleash Nuxt Developer Experience.
 </p>
 
 > [!NOTE]
-> You are current at the `main` branch for v4 development. The latest stable branch is [`v3`](https://github.com/nuxt/devtools/tree/v3).
+> You are at the `main` branch for v4. The v3 branch is [`v3`](https://github.com/nuxt/devtools/tree/v3).
 
 <br>
 
 ## Installation
 
-> Nuxt DevTools v2 requires **Nuxt v3.15.0 or higher**.
+> Nuxt DevTools v4 requires **Nuxt v4.5.0 or higher** (Vite 8). It is built on [Vite DevTools](https://github.com/vitejs/devtools) and shows up as the `Nuxt` group inside the Vite DevTools panel.
 
-Nuxt DevTools is **enabled by default** in Nuxt v3.8.0. You can press <kbd>Shift</kbd> + <kbd>Alt</kbd> / <kbd>⇧ Shift</kbd> + <kbd>⌥ Option</kbd> + <kbd>D</kbd> in your app to open it up.
+Nuxt DevTools is **enabled by default**. You can press <kbd>Shift</kbd> + <kbd>Alt</kbd> / <kbd>⇧ Shift</kbd> + <kbd>⌥ Option</kbd> + <kbd>D</kbd> in your app to open it up.
 
 If you want to explicitly enable or disable Nuxt DevTools, you can update your `nuxt.config` with:
 
@@ -44,21 +44,57 @@ export default defineNuxtConfig({
 })
 ```
 
+### Nuxt 4
+
+Nuxt 5 ships with Nuxt DevTools v4. Nuxt 4.5+ still bundles v3; override `@nuxt/devtools` to `^4.0.0` with your package manager (`overrides` for npm and pnpm, `resolutions` for yarn), remove your lockfile and reinstall. See the [upgrade guide](https://devtools.nuxt.com/guide/upgrading-to-v4) for details and for what changed.
+
 ### 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>
+
+```json
+{
+  "overrides": {
+    "@nuxt/devtools": "npm:@nuxt/devtools-nightly@latest"
+  }
+}
+```
+
+</details>
+
+<details>
+<summary>yarn</summary>
 
-```diff
+```json
 {
-  "devDependencies": {
---    "@nuxt/devtools": "^0.1.0"
-++    "@nuxt/devtools": "npm:@nuxt/devtools-nightly@latest"
+  "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 +107,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 +134,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,33 @@
 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:os';
+import 'consola/utils';
+import 'devframe/utils/serve-static';
+import 'verkit';
+import 'vite';
+import '../shared/devtools-nightly.DnJkSJYB.mjs';
+import '../dirs.mjs';
+import 'node:path';
+import 'node:url';
+import 'node:child_process';
+import 'node:fs';
+import 'node:util';
+import 'tinyglobby';
+import 'destr';
+import '../../dist/runtime/shared/hooks.js';
+import 'devframe/utils/hash';
+import 'magicast';
+import 'magicast/helpers';
+import 'node:process';
+import 'node:module';
+import '@vitejs/devtools-kit/constants';
+import 'perfect-debounce';
 
 async function getFolderSize(dir) {
   const dirents = await readdir(dir, {
@@ -37,7 +62,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,
@@ -48,7 +73,10 @@ async function setup(nuxt, options) {
   nuxt.hook("build:analyze:done", async (meta) => {
     const _meta = meta;
     _meta.size = _meta.size || {};
-    const dirs = [join(meta.buildDir, "dist/client"), meta.outDir];
+    const dirs = [
+      join(meta.buildDir, "dist/client"),
+      meta.outDir
+    ];
     const [clientBundleSize, nitroBundleSize] = await Promise.all(dirs.map(getFolderSize));
     _meta.size.clientBundle = clientBundleSize;
     _meta.size.nitroBundle = nitroBundleSize;

package/dist/chunks/assets.mjs

@@ -0,0 +1,24 @@
+import { createAssetsDevframe } from '@devframes/plugin-assets';
+import { onDevtoolsReady, NUXT_DEVTOOLS_GROUP_ID } from '@nuxt/devtools-kit';
+import { resolve } from 'pathe';
+import { d as defaultAllowedExtensions } from '../shared/devtools-nightly.DnJkSJYB.mjs';
+import '@nuxt/kit';
+
+function setup({ nuxt, options }) {
+  const definition = createAssetsDevframe({
+    dir: resolve(nuxt.options.srcDir, nuxt.options.dir.public),
+    baseURL: nuxt.options.app.baseURL,
+    uploadExtensions: options.assets?.uploadExtensions || defaultAllowedExtensions
+  });
+  onDevtoolsReady((kit) => {
+    const services = definition.services?.filter((service) => !kit.services.has(service.package));
+    return kit.install({ ...definition, services }, {
+      dock: {
+        groupId: NUXT_DEVTOOLS_GROUP_ID,
+        category: "analyze"
+      }
+    });
+  }, nuxt);
+}
+
+export { setup };

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 };