Tailwindcss v4 plugin - Build resolution error with @docsearch/css

[shayanhabibi]

Terminal output

📦 Compiling ssr router...
vinxi building router ssr in http mode
vite v6.3.5 building SSR bundle for production...
✓ 272 modules transformed.
✗ Build failed in 17.97s
Error building router ssr: [@tailwindcss/vite:generate:build] Can't resolve '@docsearch/css' in 'C:\Users\shaya\RiderProjects\Partas.Solid\node_modules\@kobalte\solidbase\dist\default-theme\components'
file: C:/Users/shaya/RiderProjects/Partas.Solid/node_modules/@kobalte/solidbase/dist/default-theme/components/DocSearch.css
    at finishWithoutResolve (C:\Users\shaya\RiderProjects\Partas.Solid\node_modules\enhanced-resolve\lib\Resolver.js:567:18)
    at C:\Users\shaya\RiderProjects\Partas.Solid\node_modules\enhanced-resolve\lib\Resolver.js:659:14
    at C:\Users\shaya\RiderProjects\Partas.Solid\node_modules\enhanced-resolve\lib\Resolver.js:720:5
    at eval (eval at create (C:\Users\shaya\RiderProjects\Partas.Solid\node_modules\tapable\lib\HookCodeFactory.js:33:10), <anonymous>:15:1)
    at C:\Users\shaya\RiderProjects\Partas.Solid\node_modules\enhanced-resolve\lib\Resolver.js:720:5
    at eval (eval at create (C:\Users\shaya\RiderProjects\Partas.Solid\node_modules\tapable\lib\HookCodeFactory.js:33:10), <anonymous>:27:1)
    at C:\Users\shaya\RiderProjects\Partas.Solid\node_modules\enhanced-resolve\lib\DescriptionFilePlugin.js:89:43
    at C:\Users\shaya\RiderProjects\Partas.Solid\node_modules\enhanced-resolve\lib\Resolver.js:720:5
    at eval (eval at create (C:\Users\shaya\RiderProjects\Partas.Solid\node_modules\tapable\lib\HookCodeFactory.js:33:10), <anonymous>:15:1)
    at C:\Users\shaya\RiderProjects\Partas.Solid\node_modules\enhanced-resolve\lib\Resolver.js:720:5
    at eval (eval at create (C:\Users\shaya\RiderProjects\Partas.Solid\node_modules\tapable\lib\HookCodeFactory.js:33:10), <anonymous>:15:1)
    at C:\Users\shaya\RiderProjects\Partas.Solid\node_modules\enhanced-resolve\lib\Resolver.js:720:5
    at eval (eval at create (C:\Users\shaya\RiderProjects\Partas.Solid\node_modules\tapable\lib\HookCodeFactory.js:33:10), <anonymous>:42:1)
    at C:\Users\shaya\RiderProjects\Partas.Solid\node_modules\enhanced-resolve\lib\ConditionalPlugin.js:53:42
    at C:\Users\shaya\RiderProjects\Partas.Solid\node_modules\enhanced-resolve\lib\Resolver.js:720:5
    at eval (eval at create (C:\Users\shaya\RiderProjects\Partas.Solid\node_modules\tapable\lib\HookCodeFactory.js:33:10), <anonymous>:16:1)
    at C:\Users\shaya\RiderProjects\Partas.Solid\node_modules\enhanced-resolve\lib\forEachBail.js:39:13
    at C:\Users\shaya\RiderProjects\Partas.Solid\node_modules\enhanced-resolve\lib\ModulesInHierarchicalDirectoriesPlugin.js:83:16
    at SyncAsyncFileSystemDecorator.stat (C:\Users\shaya\RiderProjects\Partas.Solid\node_modules\enhanced-resolve\lib\SyncAsyncFileSystemDecorator.js:66:34)
    at C:\Users\shaya\RiderProjects\Partas.Solid\node_modules\enhanced-resolve\lib\ModulesInHierarchicalDirectoriesPlugin.js:57:11
    at next (C:\Users\shaya\RiderProjects\Partas.Solid\node_modules\enhanced-resolve\lib\forEachBail.js:35:3)
    at forEachBail (C:\Users\shaya\RiderProjects\Partas.Solid\node_modules\enhanced-resolve\lib\forEachBail.js:49:9)
    at C:\Users\shaya\RiderProjects\Partas.Solid\node_modules\enhanced-resolve\lib\ModulesInHierarchicalDirectoriesPlugin.js:49:6
    at _next0 (eval at create (C:\Users\shaya\RiderProjects\Partas.Solid\node_modules\tapable\lib\HookCodeFactory.js:33:10), <anonymous>:8:1)
    at eval (eval at create (C:\Users\shaya\RiderProjects\Partas.Solid\node_modules\tapable\lib\HookCodeFactory.js:33:10), <anonymous>:30:1)
    at C:\Users\shaya\RiderProjects\Partas.Solid\node_modules\enhanced-resolve\lib\SelfReferencePlugin.js:78:13
    at Hook.eval [as callAsync] (eval at create (C:\Users\shaya\RiderProjects\Partas.Solid\node_modules\tapable\lib\HookCodeFactory.js:33:10), <anonymous>:22:1)
    at Resolver.doResolve (C:\Users\shaya\RiderProjects\Partas.Solid\node_modules\enhanced-resolve\lib\Resolver.js:717:16)
    at C:\Users\shaya\RiderProjects\Partas.Solid\node_modules\enhanced-resolve\lib\ConditionalPlugin.js:42:14
    at Hook.eval [as callAsync] (eval at create (C:\Users\shaya\RiderProjects\Partas.Solid\node_modules\tapable\lib\HookCodeFactory.js:33:10), <anonymous>:37:1)
    at Resolver.doResolve (C:\Users\shaya\RiderProjects\Partas.Solid\node_modules\enhanced-resolve\lib\Resolver.js:717:16)
    at C:\Users\shaya\RiderProjects\Partas.Solid\node_modules\enhanced-resolve\lib\NextPlugin.js:30:14
    at Hook.eval [as callAsync] (eval at create (C:\Users\shaya\RiderProjects\Partas.Solid\node_modules\tapable\lib\HookCodeFactory.js:33:10), <anonymous>:7:1)
    at Resolver.doResolve (C:\Users\shaya\RiderProjects\Partas.Solid\node_modules\enhanced-resolve\lib\Resolver.js:717:16)
    at C:\Users\shaya\RiderProjects\Partas.Solid\node_modules\enhanced-resolve\lib\NextPlugin.js:30:14
    at Hook.eval [as callAsync] (eval at create (C:\Users\shaya\RiderProjects\Partas.Solid\node_modules\tapable\lib\HookCodeFactory.js:33:10), <anonymous>:7:1)
    at Resolver.doResolve (C:\Users\shaya\RiderProjects\Partas.Solid\node_modules\enhanced-resolve\lib\Resolver.js:717:16)
    at C:\Users\shaya\RiderProjects\Partas.Solid\node_modules\enhanced-resolve\lib\DescriptionFilePlugin.js:78:17
    at C:\Users\shaya\RiderProjects\Partas.Solid\node_modules\enhanced-resolve\lib\DescriptionFileUtils.js:161:24
    at C:\Users\shaya\RiderProjects\Partas.Solid\node_modules\enhanced-resolve\lib\forEachBail.js:39:13
    at onJson (C:\Users\shaya\RiderProjects\Partas.Solid\node_modules\enhanced-resolve\lib\DescriptionFileUtils.js:96:6)
    at C:\Users\shaya\RiderProjects\Partas.Solid\node_modules\enhanced-resolve\lib\DescriptionFileUtils.js:123:7
    at SyncAsyncFileSystemDecorator.readJson (C:\Users\shaya\RiderProjects\Partas.Solid\node_modules\enhanced-resolve\lib\SyncAsyncFileSystemDecorator.js:204:6)
    at C:\Users\shaya\RiderProjects\Partas.Solid\node_modules\enhanced-resolve\lib\DescriptionFileUtils.js:104:26
    at next (C:\Users\shaya\RiderProjects\Partas.Solid\node_modules\enhanced-resolve\lib\forEachBail.js:35:3)
    at forEachBail (C:\Users\shaya\RiderProjects\Partas.Solid\node_modules\enhanced-resolve\lib\forEachBail.js:49:9)
    at findDescriptionFile (C:\Users\shaya\RiderProjects\Partas.Solid\node_modules\enhanced-resolve\lib\DescriptionFileUtils.js:70:3)
    at C:\Users\shaya\RiderProjects\Partas.Solid\node_modules\enhanced-resolve\lib\DescriptionFileUtils.js:167:12
    at C:\Users\shaya\RiderProjects\Partas.Solid\node_modules\enhanced-resolve\lib\forEachBail.js:39:13
    at C:\Users\shaya\RiderProjects\Partas.Solid\node_modules\enhanced-resolve\lib\DescriptionFileUtils.js:113:16 {
  details: "resolve '@docsearch/css' in 'C:\\Users\\shaya\\RiderProjects\\Partas.Solid\\node_modules\\@kobalte\\solidbase\\dist\\default-theme\\components'\n" +
    '  Parsed request is a module\n' +
    '  using description file: C:\\Users\\shaya\\RiderProjects\\Partas.Solid\\node_modules\\@kobalte\\solidbase\\package.json (relative path: ./dist/default-theme/components)\n' +
    '    resolve as module\n' +
    "      C:\\Users\\shaya\\RiderProjects\\Partas.Solid\\node_modules\\@kobalte\\solidbase\\dist\\default-theme\\components\\node_modules doesn't exist or is not a directory\n" +
    "      C:\\Users\\shaya\\RiderProjects\\Partas.Solid\\node_modules\\@kobalte\\solidbase\\dist\\default-theme\\node_modules doesn't exist or is not a directory\n" +
    "      C:\\Users\\shaya\\RiderProjects\\Partas.Solid\\node_modules\\@kobalte\\solidbase\\dist\\node_modules doesn't exist or is not a directory\n" +
    "      C:\\Users\\shaya\\RiderProjects\\Partas.Solid\\node_modules\\@kobalte\\solidbase\\node_modules doesn't exist or is not a directory\n" +
    "      C:\\Users\\shaya\\RiderProjects\\Partas.Solid\\node_modules\\@kobalte\\node_modules doesn't exist or is not a directory\n" +
    "      C:\\Users\\shaya\\RiderProjects\\Partas.Solid\\node_modules\\node_modules doesn't exist or is not a directory\n" +
    '      looking for modules in C:\\Users\\shaya\\RiderProjects\\Partas.Solid\\node_modules\n' +
    '        single file module\n' +
    '          using description file: C:\\Users\\shaya\\RiderProjects\\Partas.Solid\\package.json (relative path: ./node_modules/@docsearch/css)\n' +
    '            no extension\n' +
    '              C:\\Users\\shaya\\RiderProjects\\Partas.Solid\\node_modules\\@docsearch\\css is not a file\n' +
    '            .css\n' +
    "              C:\\Users\\shaya\\RiderProjects\\Partas.Solid\\node_modules\\@docsearch\\css.css doesn't exist\n" +
    '        existing directory C:\\Users\\shaya\\RiderProjects\\Partas.Solid\\node_modules\\@docsearch\\css\n' +
    '          using description file: C:\\Users\\shaya\\RiderProjects\\Partas.Solid\\node_modules\\@docsearch\\css\\package.json (relative path: .)\n' +
    '            using description file: C:\\Users\\shaya\\RiderProjects\\Partas.Solid\\package.json (relative path: ./node_modules/@docsearch/css)\n' +
    '              no extension\n' +
    '                C:\\Users\\shaya\\RiderProjects\\Partas.Solid\\node_modules\\@docsearch\\css is not a file\n' +
    '              .css\n' +
    "                C:\\Users\\shaya\\RiderProjects\\Partas.Solid\\node_modules\\@docsearch\\css.css doesn't exist\n" +
    '              as directory\n' +
    '                existing directory C:\\Users\\shaya\\RiderProjects\\Partas.Solid\\node_modules\\@docsearch\\css\n' +
    '                  using description file: C:\\Users\\shaya\\RiderProjects\\Partas.Solid\\node_modules\\@docsearch\\css\\package.json (relative path: .)\n' +
    '                    using path: C:\\Users\\shaya\\RiderProjects\\Partas.Solid\\node_modules\\@docsearch\\css\\index\n' +
    '                      using description file: C:\\Users\\shaya\\RiderProjects\\Partas.Solid\\node_modules\\@docsearch\\css\\package.json (relative path: ./index)\n' +
    '                        no extension\n' +
    "                          C:\\Users\\shaya\\RiderProjects\\Partas.Solid\\node_modules\\@docsearch\\css\\index doesn't exist\n" +
    '                        .css\n' +
    "                          C:\\Users\\shaya\\RiderProjects\\Partas.Solid\\node_modules\\@docsearch\\css\\index.css doesn't exist\n" +
    "      C:\\Users\\shaya\\RiderProjects\\node_modules doesn't exist or is not a directory\n" +
    "      C:\\Users\\shaya\\node_modules doesn't exist or is not a directory\n" +
    "      C:\\Users\\node_modules doesn't exist or is not a directory\n" +
    "      C:\\node_modules doesn't exist or is not a directory",
  code: 'PLUGIN_ERROR',
  plugin: '@tailwindcss/vite:generate:build',
  hook: 'transform',
  id: 'C:/Users/shaya/RiderProjects/Partas.Solid/node_modules/@kobalte/solidbase/dist/default-theme/components/DocSearch.css',

app config

export default defineConfig(withSolidBase(
    {
        // Change to project name as required
        appRoot: "./Partas.Solid",
        routeDir: "./routes",
        // Recommended to use .fs.jsx extension so that fable clean will not
        // wipe out solid-start files
        extensions: [ 'js', 'jsx' , 'ts', 'tsx', 'fs.jsx', 'mdx', 'md' ],
        // Vite config
        vite: {
            plugins:[
                devtools({
                    autoname: true
                }),
                tailwindcss()
            ],
            server: {
                watch: {
                    ignore: [
                        "**/*.fs",
                        "**/*.fsx"
                    ]
                }
            },
        },
        // Vinxi/Nitro/SolidStart
        server: {
            ssr: true,
            prerender: {
                crawlLinks: true
            },
            preset: "vercel",
        }
    },

Attempted fixes

• Explicit installation of @docsearch/css
• Client only tailwindcss plugin
• Removing @docsearch entirely from stack
• Reinstalling solidbase

[shayanhabibi]

Workaround:

/* app.config.js */
export default defineConfig(withSolidBase({
        vite: {
            resolve: {
                alias: {
                    "@docsearch/css": resolve(__dirname, "node_modules/@kobalte/solidbase/node_modules/@docsearch/css/dist/style.css"),
                },
            },
      }
}

npm install patch-package --save-dev

Patch node_modules/@kobalte/solidbase/dist/default-theme/components/DocSearch.css and remove @apply font-sans.

npx patch-package @kobalte/solidbase

/* package.json */
{
  "scripts": {
    "postinstall": "patch-package",
  }
}