From 26f585661365a44e911be87a100d7930051fdee3 Mon Sep 17 00:00:00 2001 From: Daniel Roe Date: Sun, 26 Oct 2025 13:00:40 +0900 Subject: [PATCH 1/2] fix(devtools): use vite plugin for env-specific config --- local.ts | 4 +- packages/devtools/client/modules/markdown.ts | 4 +- packages/devtools/src/module-main.ts | 12 +++-- .../devtools/src/server-rpc/server-data.ts | 44 ++++++++++--------- playgrounds/module-starter/src/devtools.ts | 3 +- 5 files changed, 34 insertions(+), 33 deletions(-) diff --git a/local.ts b/local.ts index b519052c80..bebeddb841 100644 --- a/local.ts +++ b/local.ts @@ -18,7 +18,7 @@ import type { ModuleOptions } from './packages/devtools/src/types' * }) * ``` */ -import { defineNuxtModule, logger } from '@nuxt/kit' +import { defineNuxtModule, extendViteConfig, logger } from '@nuxt/kit' import { getPort } from 'get-port-please' import { resolve } from 'pathe' import { searchForWorkspaceRoot } from 'vite' @@ -40,7 +40,7 @@ export default defineNuxtModule({ const workspaceRoot = resolve(packageDir, '../..') const PORT = await getPort({ port: 12442 }) - nuxt.hook('vite:extendConfig', (config) => { + extendViteConfig((config) => { config.server ||= {} // add proxy to client config.server.proxy ||= {} diff --git a/packages/devtools/client/modules/markdown.ts b/packages/devtools/client/modules/markdown.ts index 5969b7efda..cec9f64f83 100644 --- a/packages/devtools/client/modules/markdown.ts +++ b/packages/devtools/client/modules/markdown.ts @@ -1,5 +1,5 @@ import type { BuiltinLanguage } from 'shiki' -import { defineNuxtModule, logger } from '@nuxt/kit' +import { defineNuxtModule, extendViteConfig, logger } from '@nuxt/kit' import { consola } from 'consola' import LinkAttributes from 'markdown-it-link-attributes' import { createHighlighter } from 'shiki' @@ -24,7 +24,7 @@ export default defineNuxtModule({ nuxt.options.extensions.push('.md') - nuxt.hook('vite:extendConfig', async (config) => { + extendViteConfig((config) => { config.plugins!.push( Markdown({ async markdownItSetup(md) { diff --git a/packages/devtools/src/module-main.ts b/packages/devtools/src/module-main.ts index 5bba04c896..7df3486dda 100644 --- a/packages/devtools/src/module-main.ts +++ b/packages/devtools/src/module-main.ts @@ -5,7 +5,7 @@ import type { ModuleOptions, NuxtDevToolsOptions } from './types' import { existsSync } from 'node:fs' import fs from 'node:fs/promises' import os from 'node:os' -import { addPlugin, addTemplate, addVitePlugin, logger } from '@nuxt/kit' +import { addImports, addPlugin, addTemplate, addVitePlugin, extendViteConfig, logger } from '@nuxt/kit' import { colors } from 'consola/utils' import { join } from 'pathe' import sirv from 'sirv' @@ -110,7 +110,7 @@ window.__NUXT_DEVTOOLS_TIME_METRIC__.appInit = Date.now() const clientDirExists = existsSync(clientDir) - nuxt.hook('vite:extendConfig', (config) => { + extendViteConfig((config) => { config.server ||= {} config.server.fs ||= {} config.server.fs.allow ||= [ @@ -126,11 +126,9 @@ window.__NUXT_DEVTOOLS_TIME_METRIC__.appInit = Date.now() config.server.watch.ignored.push('**/.cache/nuxt-devtools/**') }) - nuxt.hook('imports:extend', (imports) => { - imports.push({ - name: 'useNuxtDevTools', - from: join(runtimeDir, 'use-nuxt-devtools'), - }) + addImports({ + name: 'useNuxtDevTools', + from: join(runtimeDir, 'use-nuxt-devtools'), }) const ROUTE_PATH = `${nuxt.options.app.baseURL || '/'}/__nuxt_devtools__`.replace(/\/+/g, '/') diff --git a/packages/devtools/src/server-rpc/server-data.ts b/packages/devtools/src/server-rpc/server-data.ts index bf367113a8..1f05bcbb31 100644 --- a/packages/devtools/src/server-rpc/server-data.ts +++ b/packages/devtools/src/server-rpc/server-data.ts @@ -1,6 +1,7 @@ import type { Nitro } from 'nitropack' import type { ResolvedConfig } from 'vite' import type { NuxtDevtoolsServerContext, ServerFunctions } from '../types' +import { addVitePlugin } from '@nuxt/kit' export function setupServerDataRPC({ nuxt, @@ -32,27 +33,28 @@ export function setupServerDataRPC({ nitro = _nitro }) - nuxt.hook('vite:extendConfig', (vite, options) => { - if (options.isServer) { - vite.plugins ||= [] - vite.plugins.push({ - name: 'nuxt:devtools:config-retriever', - enforce: 'post', - configResolved(config) { - viteServer = normalizeViteConfig(config) - }, - }) - } - else if (options.isClient) { - vite.plugins ||= [] - vite.plugins.push({ - name: 'nuxt:devtools:config-retriever', - enforce: 'post', - configResolved(config) { - viteClient = normalizeViteConfig(config) - }, - }) - } + addVitePlugin({ + name: 'nuxt:devtools:config', + applyToEnvironment(environment) { + if (environment.name === 'ssr') { + return { + name: 'nuxt:devtools:config-retriever', + enforce: 'post', + configResolved(config) { + viteServer = normalizeViteConfig(config) + }, + } + } + if (environment.name === 'client') { + return { + name: 'nuxt:devtools:config-retriever', + enforce: 'post', + configResolved(config) { + viteClient = normalizeViteConfig(config) + }, + } + } + }, }) return { diff --git a/playgrounds/module-starter/src/devtools.ts b/playgrounds/module-starter/src/devtools.ts index 64323e2840..8666403592 100644 --- a/playgrounds/module-starter/src/devtools.ts +++ b/playgrounds/module-starter/src/devtools.ts @@ -1,6 +1,7 @@ import type { Resolver } from '@nuxt/kit' import type { Nuxt } from 'nuxt/schema' import { existsSync } from 'node:fs' +import { extendViteConfig } from '@nuxt/kit' const DEVTOOLS_UI_ROUTE = '/__my-module' const DEVTOOLS_UI_LOCAL_PORT = 3300 @@ -21,7 +22,7 @@ export function setupDevToolsUI(nuxt: Nuxt, resolver: Resolver) { } // In local development, start a separate Nuxt Server and proxy to serve the client else { - nuxt.hook('vite:extendConfig', (config) => { + extendViteConfig((config) => { config.server = config.server || {} config.server.proxy = config.server.proxy || {} config.server.proxy[DEVTOOLS_UI_ROUTE] = { From 6c62527732b540f9310ec1b73e80e30adef93f93 Mon Sep 17 00:00:00 2001 From: Daniel Roe Date: Sun, 26 Oct 2025 13:04:09 +0900 Subject: [PATCH 2/2] chore: revert starter example --- playgrounds/module-starter/src/devtools.ts | 3 +-- 1 file changed, 1 insertion(+), 2 deletions(-) diff --git a/playgrounds/module-starter/src/devtools.ts b/playgrounds/module-starter/src/devtools.ts index 8666403592..64323e2840 100644 --- a/playgrounds/module-starter/src/devtools.ts +++ b/playgrounds/module-starter/src/devtools.ts @@ -1,7 +1,6 @@ import type { Resolver } from '@nuxt/kit' import type { Nuxt } from 'nuxt/schema' import { existsSync } from 'node:fs' -import { extendViteConfig } from '@nuxt/kit' const DEVTOOLS_UI_ROUTE = '/__my-module' const DEVTOOLS_UI_LOCAL_PORT = 3300 @@ -22,7 +21,7 @@ export function setupDevToolsUI(nuxt: Nuxt, resolver: Resolver) { } // In local development, start a separate Nuxt Server and proxy to serve the client else { - extendViteConfig((config) => { + nuxt.hook('vite:extendConfig', (config) => { config.server = config.server || {} config.server.proxy = config.server.proxy || {} config.server.proxy[DEVTOOLS_UI_ROUTE] = {