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

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>
+
+```json
+{
+  "overrides": {
+    "@nuxt/devtools": "npm:@nuxt/devtools-nightly@latest"
+  }
+}
+```
+
+</details>
+
+<details>
+<summary>yarn</summary>
+
+```json
+{
+  "resolutions": {
+    "@nuxt/devtools": "npm:@nuxt/devtools-nightly@latest"
+  }
+}
+```
+
+</details>
 
-```diff
+<details>
+<summary>pnpm</summary>
+
+```json
 {
-  "devDependencies": {
---    "@nuxt/devtools": "^0.1.0"
-++    "@nuxt/devtools": "npm:@nuxt/devtools-nightly@latest"
+  "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
   }
 })

package/dist/chunks/analyze-build.mjs

@@ -1,8 +1,39 @@
 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.CCWq4fFE.mjs';
+import '../dirs.mjs';
+import 'node:path';
+import 'node:url';
+import '@devframes/plugin-data-inspector';
+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 +68,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,75 @@
+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';
+import { mountDevframe } from '@vitejs/devtools-kit/node';
+
+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 mountDevframe(kit, mountedDefinition, {
+      dock: {
+        groupId: NUXT_DEVTOOLS_GROUP_ID,
+        category: "modules"
+      }
+    });
+  }, nuxt);
+}
+
+export { resolveCodeServerOptions, setup };