fix: resolve @nuxt/kit module import error in browser

- Replace external module references with empty stub file
- Add .nuxt-stubs/empty.mjs to provide browser-compatible module
- Update workaround to resolve server-only modules to stub file instead of marking as external

nuxt4-app/.nuxt-stubs/empty.mjs

@@ -0,0 +1 @@
+export default {}

nuxt4-app/nuxt.config.workaround.ts

@@ -2,30 +2,44 @@
 // This is a temporary fix until @nuxt/ui properly handles ssr: false
 
 import type { Plugin } from 'vite'
+import { fileURLToPath } from 'url'
+import { dirname, resolve } from 'path'
+
+const __filename = fileURLToPath(import.meta.url)
+const __dirname = dirname(__filename)
+const emptyModulePath = resolve(__dirname, '.nuxt-stubs/empty.mjs')
 
 export function disableImportProtection(): Plugin {
   return {
     name: 'disable-import-protection-for-nuxt-ui',
     enforce: 'pre',
     resolveId(id, importer) {
-      // External node binary files
+      // Server-only packages that should be stubbed for client bundle
-      if (id.endsWith('.node')) {
+      const serverPackages = [
-        return { id, external: true }
+        '@nuxt/kit',
-      }
+        '@tailwindcss/node',
+        '@tailwindcss/oxide',
+        'jiti'
+      ]
 
-      // External Node.js built-in modules
-      const nodeModules = ['fs', 'path', 'url', 'fs/promises', 'node:url', 'node:module', 'node:fs', 'node:path']
-      if (nodeModules.includes(id) || id.startsWith('node:')) {
-        return { id, external: true }
-      }
-
-      // External server-only packages from @nuxt/ui imports
-      const serverPackages = ['@nuxt/kit', '@tailwindcss/node', '@tailwindcss/oxide', 'jiti']
       for (const pkg of serverPackages) {
         if (id === pkg || id.startsWith(pkg + '/')) {
-          return { id, external: true }
+          return emptyModulePath
         }
       }
+
+      // Stub .node binary files
+      if (id.endsWith('.node')) {
+        return emptyModulePath
+      }
+
+      // Stub Node.js built-in modules for client bundle
+      const nodeModules = ['fs', 'path', 'url', 'fs/promises']
+      const nodePrefix = ['node:url', 'node:module', 'node:fs', 'node:path']
+
+      if (nodeModules.includes(id) || nodePrefix.includes(id) || id.startsWith('node:')) {
+        return emptyModulePath
+      }
     }
   }
 }