diff --git a/.changeset/external-dev-styles.md b/.changeset/external-dev-styles.md
new file mode 100644
index 0000000..68f6ca3
--- /dev/null
+++ b/.changeset/external-dev-styles.md
@@ -0,0 +1,9 @@
+---
+'vite-plugin-solid': patch
+---
+
+Let provider-owned SSR environments serve turnkey development requests without
+calling `ssrLoadModule`. Entry CSS and server functions are transported through
+the generated handler so isolated runtimes retain SSR styles and HMR support.
+
+Add `ssr.external` for integrations that also own the server build wiring.
diff --git a/examples/turnkey/test/run.mjs b/examples/turnkey/test/run.mjs
index 099edce..49a2551 100644
--- a/examples/turnkey/test/run.mjs
+++ b/examples/turnkey/test/run.mjs
@@ -62,6 +62,7 @@ import { spawn, execSync } from 'node:child_process';
 import { fileURLToPath } from 'node:url';
 import path from 'node:path';
 import { rmSync, existsSync, readdirSync, readFileSync, writeFileSync } from 'node:fs';
+import { createServer } from 'vite';
 
 const exampleDir = path.dirname(path.dirname(fileURLToPath(import.meta.url)));
 const CHROME = '/Applications/Google Chrome.app/Contents/MacOS/Google Chrome';
@@ -1321,7 +1322,67 @@ async function runBabelHmrMode() {
   }
 }
 
-const ALL_MODES = ['dev', 'prod', 'document', 'entries', 'endpoint', 'frames', 'babel-hmr'];
+async function runExternalMode() {
+  const mode = 'external';
+  console.log(`\n=== ${mode.toUpperCase()} ===`);
+  process.env.SOLID_EXTERNAL = '1';
+  let server;
+
+  try {
+    server = await createServer({ root: exampleDir, server: { middlewareMode: true } });
+    const clientModule = await server.environments.client.transformRequest('/src/api.ts');
+    const functionId = extractFunctionId(clientModule?.code || '', 'getServerMessage');
+    const handler = await server.ssrLoadModule('virtual:solid-ssr-handler');
+    const response = await handler.handleRequest(new Request('http://localhost/'));
+    const html = await response.text();
+    record(
+      mode,
+      'ssr',
+      'external handler renders the app',
+      response.status === 200 && html.includes('Turnkey SSR'),
+    );
+    record(
+      mode,
+      'css',
+      'virtual styles module inlines entry CSS',
+      html.includes('data-vite-dev-id') && html.includes('rgb(20, 40, 60)'),
+    );
+
+    const functionResponse = functionId
+      ? await handler.handleRequest(
+          new Request(
+            `http://localhost/_server?id=${encodeURIComponent(functionId)}&args=${encodeURIComponent('["external"]')}`,
+            { method: 'POST' },
+          ),
+        )
+      : null;
+    record(
+      mode,
+      'sf',
+      'external handler composes server functions in dev',
+      functionResponse
+        ? (await functionResponse.text()) === 'hello external from the server'
+        : false,
+      functionId ? undefined : 'could not extract function id',
+    );
+  } catch (error) {
+    record(mode, 'run', 'mode completed', false, String(error));
+  } finally {
+    await server?.close();
+    delete process.env.SOLID_EXTERNAL;
+  }
+}
+
+const ALL_MODES = [
+  'dev',
+  'prod',
+  'document',
+  'entries',
+  'endpoint',
+  'frames',
+  'babel-hmr',
+  'external',
+];
 const arg = process.argv[2];
 const modes = ALL_MODES.includes(arg) ? [arg] : ALL_MODES;
 for (const mode of modes) {
@@ -1331,7 +1392,8 @@ for (const mode of modes) {
   else if (mode === 'entries') await runEntriesMode();
   else if (mode === 'endpoint') await runEndpointMode();
   else if (mode === 'frames') await runFramesMode();
-  else await runBabelHmrMode();
+  else if (mode === 'babel-hmr') await runBabelHmrMode();
+  else await runExternalMode();
 }
 
 const failed = results.filter((r) => !r.ok);
diff --git a/examples/turnkey/vite.config.ts b/examples/turnkey/vite.config.ts
index 17688e1..403d676 100644
--- a/examples/turnkey/vite.config.ts
+++ b/examples/turnkey/vite.config.ts
@@ -35,7 +35,7 @@ export default defineConfig({
         ? { app: 'src/frames/FramesApp.tsx' }
         : process.env.SSR_DOCUMENT
           ? { document: process.env.SSR_DOCUMENT }
-          : {},
+          : { external: !!process.env.SOLID_EXTERNAL },
       serverFunctions: serverComponents
         ? { components: true }
         : process.env.SERVER_FN_ENDPOINT
diff --git a/src/dev-manifest.ts b/src/dev-manifest.ts
index e57bf5b..1705022 100644
--- a/src/dev-manifest.ts
+++ b/src/dev-manifest.ts
@@ -18,6 +18,7 @@ import type { DevEnvironment, EnvironmentModuleNode, ViteDevServer } from 'vite'
  */
 
 export type DevStyleDescriptor = { id: string; content: string; attrs?: Record<string, string> };
+export type DevStyleSource = { id: string; url: string };
 
 export type ResolvedAssets = {
   js: string[];
@@ -98,12 +99,14 @@ export const devStylePatch = `(function(){var P=${JSON.stringify(
 async function getModuleNode(
   env: DevEnvironment,
   file: string,
-  importer?: string,
 ): Promise<EnvironmentModuleNode | undefined> {
   try {
-    const resolved = await env.fetchModule(file, importer);
-    if (!('id' in resolved)) return;
-    return env.moduleGraph.getModuleById(resolved.id);
+    let node = env.moduleGraph.getModuleById(file) ?? (await env.moduleGraph.getModuleByUrl(file));
+    if (!node?.transformResult) {
+      await env.transformRequest(node?.url ?? file);
+      node = env.moduleGraph.getModuleById(file) ?? (await env.moduleGraph.getModuleByUrl(file));
+    }
+    return node;
   } catch {
     return;
   }
@@ -114,12 +117,13 @@ async function collectModuleDeps(
   file: string,
   deps: Set<EnvironmentModuleNode>,
   crawled: Set<string>,
-  importer?: string,
+  onFile?: (file: string) => void,
 ): Promise<void> {
   crawled.add(file);
-  const node = await getModuleNode(env, file, importer);
+  const node = await getModuleNode(env, file);
   if (!node?.id || deps.has(node)) return;
   deps.add(node);
+  if (node.file && !node.id.includes('node_modules')) onFile?.(node.file);
 
   if (cssFileRegExp.test(node.url.split('?')[0]) || node.id.includes('node_modules')) return;
 
@@ -133,7 +137,7 @@ async function collectModuleDeps(
   // from dynamicDeps — dynamic imports load their own styles when rendered.
   for (const dep of directDeps) {
     if (crawled.has(dep)) continue;
-    await collectModuleDeps(env, dep, deps, crawled, node.id);
+    await collectModuleDeps(env, dep, deps, crawled, onFile);
   }
 }
 
@@ -141,6 +145,32 @@ function injectQuery(url: string, query: string): string {
   return url.includes('?') ? `${url}&${query}` : `${url}?${query}`;
 }
 
+/** Discovers ambient CSS in an entry graph without choosing how it is transported. */
+export async function collectDevStyleSources(
+  env: DevEnvironment,
+  files: string[],
+  onFile?: (file: string) => void,
+): Promise<DevStyleSource[]> {
+  const deps = new Set<EnvironmentModuleNode>();
+  const crawled = new Set<string>();
+  for (const file of files) {
+    await collectModuleDeps(env, file, deps, crawled, onFile);
+  }
+
+  const css: DevStyleSource[] = [];
+  const seen = new Set<string>();
+  for (const node of deps) {
+    if (!node.id) continue;
+    const cleanUrl = node.url.split('?')[0];
+    if (!cssFileRegExp.test(cleanUrl) || nonAmbientQueryRegExp.test(node.url)) continue;
+    const id = wrapId(node.id);
+    if (seen.has(id)) continue;
+    seen.add(id);
+    css.push({ id, url: node.url });
+  }
+  return css;
+}
+
 /**
  * Walks the SSR module graph from `files` (root-relative or absolute) and
  * returns inline-style descriptors for every transitively imported CSS
@@ -157,32 +187,24 @@ export async function collectDevStyles(
   const clientEnv = server.environments?.client;
   if (!ssrEnv || !clientEnv) return [];
 
-  const deps = new Set<EnvironmentModuleNode>();
-  const crawled = new Set<string>();
-  for (const file of files) {
-    await collectModuleDeps(ssrEnv, path.resolve(server.config.root, file), deps, crawled);
-  }
+  const sources = await collectDevStyleSources(
+    ssrEnv,
+    files.map((file) => path.resolve(server.config.root, file)),
+  );
 
   const css: DevStyleDescriptor[] = [];
-  const seen = new Set<string>();
-  for (const node of deps) {
-    if (!node.id) continue;
-    const cleanUrl = node.url.split('?')[0];
-    if (!cssFileRegExp.test(cleanUrl) || nonAmbientQueryRegExp.test(node.url)) continue;
+  for (const source of sources) {
     // `?direct` yields the compiled stylesheet text (what Vite serves for
     // <link> requests) — through the client environment, whose css
     // pipeline matches what the browser will run for HMR updates.
     const result = await clientEnv
-      .transformRequest(injectQuery(node.url, 'direct'))
+      .transformRequest(injectQuery(source.url, 'direct'))
       .catch(() => null);
     if (result?.code == null) continue;
-    const id = wrapId(node.id);
-    if (seen.has(id)) continue;
-    seen.add(id);
     css.push({
-      id,
+      id: source.id,
       content: result.code,
-      attrs: { 'data-vite-dev-id': id },
+      attrs: { 'data-vite-dev-id': source.id },
     });
   }
   return css;
diff --git a/src/index.ts b/src/index.ts
index c91bb15..a6c95cb 100644
--- a/src/index.ts
+++ b/src/index.ts
@@ -30,7 +30,7 @@ export type { ServerFunctionsFilter } from './server-functions/index.js';
 export type { SsrOptions };
 import path from 'path';
 import type { FilterPattern, Plugin } from 'vite';
-import { createFilter, version } from 'vite';
+import { createFilter, isRunnableDevEnvironment, version } from 'vite';
 import { crawlFrameworkPkgs } from 'vitefu';
 
 const require = createRequire(import.meta.url);
@@ -379,6 +379,8 @@ export default function solidPlugin(options: Partial<Options> = {}): Plugin[] {
   const filter = createFilter(options.include, options.exclude);
   const serverComponents =
     typeof options.serverFunctions === 'object' && !!options.serverFunctions.components;
+  const externalDevServer =
+    typeof options.ssr === 'object' && options.ssr !== null && !!options.ssr.external;
 
   let needHmr = false;
   let replaceDev = false;
@@ -658,10 +660,10 @@ export default function solidPlugin(options: Partial<Options> = {}): Plugin[] {
 
     hotUpdate() {
       // solid-refresh only injects HMR boundaries into client modules, so
-      // non-client environments have no accept handlers. Without this, Vite
-      // would see no boundaries and send full-reload messages that race with
-      // client-side HMR updates.
-      if (this.environment.name !== 'client') {
+      // the in-process SSR runner should not send full reloads that race with
+      // client HMR. Remote runners still need their update so provider-owned
+      // handlers and virtual dev styles are invalidated.
+      if (this.environment.name !== 'client' && isRunnableDevEnvironment(this.environment)) {
         return [];
       }
     },
@@ -940,6 +942,7 @@ export default function solidPlugin(options: Partial<Options> = {}): Plugin[] {
     ? [
         ...serverFunctions(options.serverFunctions === true ? {} : options.serverFunctions, {
           devMiddleware: true,
+          externalDevServer,
         }),
         mainPlugin,
       ]
diff --git a/src/server-functions/index.ts b/src/server-functions/index.ts
index c3dfc33..4de8e37 100644
--- a/src/server-functions/index.ts
+++ b/src/server-functions/index.ts
@@ -12,6 +12,7 @@ import { existsSync, mkdirSync, readFileSync, writeFileSync } from 'fs';
 import path from 'path';
 import {
   createFilter,
+  isRunnableDevEnvironment,
   type EnvironmentModuleGraph,
   type FilterPattern,
   type Plugin,
@@ -240,7 +241,7 @@ function invalidateModules(
  */
 export function serverFunctions(
   options: ServerFunctionsOptions = {},
-  internal: { devMiddleware?: boolean } = {},
+  internal: { devMiddleware?: boolean; externalDevServer?: boolean } = {},
 ): Plugin[] {
   const filter = createFilter(
     options.filter?.include || DEFAULT_INCLUDE,
@@ -386,7 +387,10 @@ export function serverFunctions(
       },
       load(id, opts) {
         if (id === HANDLER_ID && opts?.ssr) {
-          return handlerModuleCode(isBuild);
+          const externalDev =
+            this.environment.mode === 'dev' &&
+            (internal.externalDevServer || !isRunnableDevEnvironment(this.environment));
+          return handlerModuleCode(isBuild || externalDev);
         }
         return null;
       },
@@ -398,6 +402,13 @@ export function serverFunctions(
       name: 'solid:server-functions/dev-middleware',
       apply: 'serve',
       configureServer(server) {
+        const ssrEnvironment = server.environments.ssr;
+        if (
+          internal.externalDevServer ||
+          (ssrEnvironment && !isRunnableDevEnvironment(ssrEnvironment))
+        ) {
+          return;
+        }
         server.middlewares.use((req, res, next) => {
           const url = new URL(req.url || '/', 'http://localhost');
           // Match with and without `base` — middleware-mode hosts may mount
diff --git a/src/ssr/index.ts b/src/ssr/index.ts
index 41831e2..4e9c740 100644
--- a/src/ssr/index.ts
+++ b/src/ssr/index.ts
@@ -2,13 +2,10 @@
 // of the existing `ssr` option) adds a serving layer on top of the SSR
 // transforms so no hand-rolled entries or dev server are needed.
 //
-// - Dev: a middleware on the Vite dev server streams the rendered app for
-//   HTML-accepting GET requests, loading the app through the SSR environment
-//   (`ssrLoadModule`) and injecting the Vite client + dev style patch + the
-//   entry graph's CSS (inlined `<style data-vite-dev-id>` tags collected
-//   from the SSR module graph, so server-painted content never flashes
-//   unstyled) into `<head>` on the way out. SSR errors flow to Vite's error
-//   middleware (stack-fixed) so the browser gets the error overlay page.
+// - Dev: runnable SSR environments are served by a Vite middleware. Provider-
+//   owned environments serve through `virtual:solid-ssr-handler` instead.
+//   Both paths inject the Vite client, dev style patch, and entry CSS as
+//   `<style data-vite-dev-id>` tags before the body can paint.
 // - Prod: the plugin configures a full-app build (client + server bundles
 //   via the Vite 6+ environments/builder API — a single `vite build` builds
 //   both) whose server entry is `virtual:solid-ssr-handler`: an
@@ -20,14 +17,23 @@
 //   absent, default entries are generated from a single root component
 //   (`ssr.app`, defaulting to `src/App.*`) wrapped in a document shell
 //   (`ssr.document`, defaulting to `src/Document.*`, else a built-in one).
-// - When `serverFunctions` is also enabled, the prod handler composes it:
-//   requests to the server-function endpoint dispatch to
-//   `virtual:solid-server-function-handler` before SSR (in dev, the
-//   server-function middleware is registered earlier and already wins).
+// - When `serverFunctions` is also enabled, the production handler and any
+//   provider-owned dev handler compose it. Runnable dev environments keep the
+//   earlier server-function middleware.
 import { existsSync } from 'fs';
 import path from 'path';
-import type { Plugin, ViteDevServer } from 'vite';
-import { collectDevStyles, devStylePatch, renderDevStyleTag } from '../dev-manifest.js';
+import {
+  isRunnableDevEnvironment,
+  type DevEnvironment,
+  type Plugin,
+  type ViteDevServer,
+} from 'vite';
+import {
+  collectDevStyles,
+  collectDevStyleSources,
+  devStylePatch,
+  renderDevStyleTag,
+} from '../dev-manifest.js';
 import { joinBase, sendWebResponse, webRequestFromNode } from '../http.js';
 
 export interface SsrOptions {
@@ -62,11 +68,22 @@ export interface SsrOptions {
    * @default "src/Document.{tsx,jsx}" when present, else a built-in shell
    */
   document?: string;
+  /**
+   * Let an integration own the server build and HTTP serving. Turnkey still
+   * provides its generated entries, request handler, and client manifest.
+   *
+   * Non-runnable development environments are detected automatically.
+   *
+   * @default false
+   */
+  external?: boolean;
 }
 
 // Server-only turnkey request handler; also the server bundle's entry so a
 // production server is one import away from `Request -> Response`.
 const HANDLER_ID = 'virtual:solid-ssr-handler';
+const DEV_STYLES_ID = 'virtual:solid-ssr-dev-styles';
+const RESOLVED_DEV_STYLES_ID = '\0' + DEV_STYLES_ID;
 // Generated default entries / document shell. The `.tsx` suffix routes them
 // through the plugin's normal JSX transform (per-environment SSR/DOM
 // compile), exactly like user-authored entry files.
@@ -175,6 +192,7 @@ export function ssrServe(
   // the server-function handler module either way). Everything is gated
   // codegen: with the option off, none of these imports exist anywhere.
   const serverComponents = !!internal.serverComponents;
+  const externalServer = !!options.external;
   let root = process.cwd();
   let base = '/';
   let isBuild = false;
@@ -205,6 +223,35 @@ export function ssrServe(
     return document ?? DOCUMENT_ID;
   }
 
+  function styleRoots(): string[] {
+    const { generated, app, document, entryServer } = requireEntries();
+    return generated ? [app!, ...(document ? [document] : [])] : [path.resolve(root, entryServer)];
+  }
+
+  async function devStylesModuleCode(
+    environment: DevEnvironment,
+    watchFile: (file: string) => void,
+  ): Promise<string> {
+    const styles = await collectDevStyleSources(environment, styleRoots(), watchFile);
+    if (!styles.length) return `export default '';`;
+
+    const imports = styles.map((style, index) => {
+      const specifier = style.url.includes('?') ? `${style.url}&inline` : `${style.url}?inline`;
+      return `import css${index} from ${JSON.stringify(specifier)};`;
+    });
+    return [
+      ...imports,
+      `const ids = ${JSON.stringify(styles.map((style) => style.id))};`,
+      `const css = [${styles.map((_, index) => `css${index}`).join(', ')}];`,
+      `const escapeAttr = value => value.replace(/&/g, '&amp;').replace(/"/g, '&quot;').replace(/</g, '&lt;');`,
+      `export default css.map((content, index) => {`,
+      `  const id = escapeAttr(ids[index]);`,
+      `  return '<style data-asset="' + id + '" data-vite-dev-id="' + id + '">' +`,
+      `    content.replace(/<\\/(style)/gi, '<\\\\/$1') + '</style>';`,
+      `}).join('');`,
+    ].join('\n');
+  }
+
   function generatedEntryServerCode(): string {
     const { app } = requireEntries();
     return [
@@ -289,11 +336,11 @@ export function ssrServe(
   // The handler module: dev and prod share the render/response plumbing;
   // they differ in how the client entry URL is known (baked dev URL vs a
   // manifest scan), what gets injected into <head> (Vite client + style
-  // patch in dev), and server-function composition (build only — in dev the
-  // server-function middleware intercepts the endpoint before SSR runs).
-  function handlerModuleCode(): string {
+  // patch in dev), and server-function composition (production and external
+  // dev; runnable dev environments use the server-function middleware).
+  function handlerModuleCode(externalDev: boolean): string {
     const { generated, entryClient } = requireEntries();
-    const composeServerFunctions = isBuild && internal.serverFunctions;
+    const composeServerFunctions = (isBuild || externalDev) && internal.serverFunctions;
     // Generated entries own the whole document wiring, so the handler also
     // injects the server-component bootstrap (the per-function-id
     // placeholder registry the render plugin references; must be inline in
@@ -304,6 +351,12 @@ export function ssrServe(
     const lines = [
       `import { provideRequestEvent } from ${JSON.stringify(STORAGE_SOURCE)};`,
       `import * as entry from ${JSON.stringify(entryServerSpec())};`,
+      ...(externalDev ? [`import DEV_STYLES_HEAD from ${JSON.stringify(DEV_STYLES_ID)};`] : []),
+      ...(composeServerFunctions
+        ? [
+            `import { handleServerFunctionRequest, endpoint } from ${JSON.stringify(SERVER_FUNCTION_HANDLER_ID)};`,
+          ]
+        : []),
       ...(injectComponentBootstrap
         ? [`import { SERVER_COMPONENT_BOOTSTRAP } from '@solidjs/web/frames';`]
         : []),
@@ -311,11 +364,6 @@ export function ssrServe(
 
     if (isBuild) {
       lines.push(`import manifest from ${JSON.stringify(MANIFEST_ID)};`);
-      if (composeServerFunctions) {
-        lines.push(
-          `import { handleServerFunctionRequest, endpoint } from ${JSON.stringify(SERVER_FUNCTION_HANDLER_ID)};`,
-        );
-      }
       lines.push(
         ``,
         `function joinAssetPath(base, file) {`,
@@ -365,9 +413,16 @@ export function ssrServe(
     }
     lines.push(`    if (!injected && chunk.includes('</head>')) {`, `      injected = true;`);
     const headParts: string[] = [];
-    // Dev: the style patch + Vite client, then the SSR'd entry styles the
-    // middleware collected (per request, so HMR-edited CSS is current).
-    if (!isBuild) headParts.push(`DEV_HEAD`, `(extraHead || '')`);
+    // Dev: the style patch + Vite client, then either middleware-provided
+    // styles or the external environment's HMR-tracked virtual styles module.
+    if (!isBuild) {
+      headParts.push(
+        `DEV_HEAD`,
+        externalDev
+          ? `(extraHead === undefined ? DEV_STYLES_HEAD : extraHead)`
+          : `(extraHead || '')`,
+      );
+    }
     if (injectComponentBootstrap) {
       headParts.push(`'<script>' + SERVER_COMPONENT_BOOTSTRAP + '</' + 'script>'`);
     }
@@ -458,28 +513,39 @@ export function ssrServe(
           // the dep scanner needs explicit entries instead.
           appType: 'custom',
           ...(build
-            ? {
-                environments: {
-                  client: {
-                    build: {
-                      manifest: true,
-                      outDir: 'dist/client',
-                      rollupOptions: { input: clientInput },
+            ? externalServer
+              ? {
+                  environments: {
+                    client: {
+                      build: {
+                        manifest: true,
+                        rollupOptions: { input: clientInput },
+                      },
                     },
                   },
-                  ssr: {
-                    build: {
-                      outDir: 'dist/server',
-                      rollupOptions: { input: { server: HANDLER_ID } },
+                }
+              : {
+                  environments: {
+                    client: {
+                      build: {
+                        manifest: true,
+                        outDir: 'dist/client',
+                        rollupOptions: { input: clientInput },
+                      },
+                    },
+                    ssr: {
+                      build: {
+                        outDir: 'dist/server',
+                        rollupOptions: { input: { server: HANDLER_ID } },
+                      },
                     },
                   },
-                },
-                // Presence of `builder` makes a plain `vite build` build the
-                // whole app (all environments: client then ssr) on Vite 6+.
-                // A classic `vite build --ssr` invocation must stay a
-                // single-environment build, so it doesn't get the flag.
-                ...(env.isSsrBuild ? {} : { builder: {} }),
-              }
+                  // Presence of `builder` makes a plain `vite build` build the
+                  // whole app (all environments: client then ssr) on Vite 6+.
+                  // A classic `vite build --ssr` invocation must stay a
+                  // single-environment build, so it doesn't get the flag.
+                  ...(env.isSsrBuild ? {} : { builder: {} }),
+                }
             : {
                 optimizeDeps: { entries: scanEntries },
               }),
@@ -494,17 +560,30 @@ export function ssrServe(
         if (source === HANDLER_ID) {
           return { id: HANDLER_ID, moduleSideEffects: true };
         }
+        if (source === DEV_STYLES_ID) {
+          return { id: RESOLVED_DEV_STYLES_ID, moduleSideEffects: true };
+        }
         if (source === ENTRY_SERVER_ID || source === ENTRY_CLIENT_ID || source === DOCUMENT_ID) {
           return { id: source, moduleSideEffects: source === ENTRY_CLIENT_ID };
         }
         return null;
       },
-      load(id, opts) {
+      async load(id, opts) {
         if (id === HANDLER_ID) {
           if (!opts?.ssr) {
             this.error(`${HANDLER_ID} is server-only; import it from server code (SSR build).`);
           }
-          return handlerModuleCode();
+          const externalDev =
+            !isBuild &&
+            this.environment.mode === 'dev' &&
+            (externalServer || !isRunnableDevEnvironment(this.environment));
+          return handlerModuleCode(externalDev);
+        }
+        if (id === RESOLVED_DEV_STYLES_ID) {
+          if (!opts?.ssr || this.environment.mode !== 'dev') {
+            this.error(`${DEV_STYLES_ID} is only available to the development server handler.`);
+          }
+          return devStylesModuleCode(this.environment, (file) => this.addWatchFile(file));
         }
         if (id === ENTRY_SERVER_ID) return generatedEntryServerCode();
         if (id === ENTRY_CLIENT_ID) return generatedEntryClientCode();
@@ -520,16 +599,14 @@ export function ssrServe(
         // this); the SSR'd tags carry data-asset + data-vite-dev-id so the
         // dev style patch drops them once Vite's own injection takes over —
         // exactly the lazy-asset dedup story, HMR included.
-        const styleRoots = () => {
-          const { generated, app, document, entryServer } = requireEntries();
-          return generated
-            ? [app!, ...(document ? [document] : [])]
-            : [path.resolve(root, entryServer)];
-        };
         // Post middleware: Vite's own middlewares (transforms, static, the
         // server-function endpoint) run first; whatever asks for HTML after
         // that gets the streamed SSR render.
         return () => {
+          const ssrEnvironment = server.environments.ssr;
+          if (externalServer || (ssrEnvironment && !isRunnableDevEnvironment(ssrEnvironment))) {
+            return;
+          }
           server.middlewares.use((req, res, next) => {
             if (req.method !== 'GET') return next();
             const accept = req.headers.accept || '';