fix(vite): don't fail builds for virtual modules that don't support inlining (#7440)

packages/vite/src/plugins/ssr-styles.ts

@@ -20,6 +20,8 @@ export function ssrStylesPlugin (options: SSRStylePluginOptions): Plugin {
 
   const relativeToSrcDir = (path: string) => relative(options.srcDir, path)
 
+  const warnCache = new Set<string>()
+
   return {
     name: 'ssr-styles',
     generateBundle (outputOptions) {
@@ -104,6 +106,13 @@ export function ssrStylesPlugin (options: SSRStylePluginOptions): Plugin {
 
         const resolved = await this.resolve(i.specifier, id)
         if (!resolved) { continue }
+        if (!(await this.resolve(resolved.id + '?inline&used'))) {
+          if (!warnCache.has(resolved.id)) {
+            warnCache.add(resolved.id)
+            this.warn(`[nuxt] Cannot extract styles for \`${i.specifier}\`. Its styles will not be inlined when server-rendering.`)
+          }
+          continue
+        }
 
         const ref = this.emitFile({
           type: 'chunk',

test/fixtures/basic/nuxt.config.ts

@@ -1,5 +1,6 @@
 import { defineNuxtConfig } from 'nuxt'
-import { addComponent } from '@nuxt/kit'
+import { addComponent, addVitePlugin, addWebpackPlugin } from '@nuxt/kit'
+import { createUnplugin } from 'unplugin'
 
 export default defineNuxtConfig({
   app: {
@@ -32,7 +33,26 @@ export default defineNuxtConfig({
   privateRuntimeConfig: {
     privateConfig: 'secret_key'
   },
-  modules: ['~/modules/example'],
+  modules: [
+    '~/modules/example',
+    function (_, nuxt) {
+      if (process.env.TEST_WITH_WEBPACK) { return }
+
+      nuxt.options.css.push('virtual.css')
+      nuxt.options.build.transpile.push('virtual.css')
+      const plugin = createUnplugin(() => ({
+        name: 'virtual',
+        resolveId (id) {
+          if (id === 'virtual.css') { return 'virtual.css' }
+        },
+        load (id) {
+          if (id === 'virtual.css') { return ':root { --virtual: red }' }
+        }
+      }))
+      addVitePlugin(plugin.vite())
+      addWebpackPlugin(plugin.webpack())
+    }
+  ],
   hooks: {
     'modules:done' () {
       addComponent({