Show warning when loading a config in v3 fails

packages/tailwindcss-language-server/src/projects.ts

@@ -19,7 +19,7 @@ import type {
 import { FileChangeType } from 'vscode-languageserver/node'
 import type { TextDocument } from 'vscode-languageserver-textdocument'
 import { URI } from 'vscode-uri'
-import { showError, SilentError } from './util/error'
+import { showError, showWarning, SilentError } from './util/error'
 import * as path from 'node:path'
 import * as fs from 'node:fs'
 import findUp from 'find-up'
@@ -838,6 +838,15 @@ export async function createProjectService(
         originalConfig = await loadConfig.module(state.configPath)
         originalConfig = originalConfig.default ?? originalConfig
         state.jit = true
+      } catch (err) {
+        // The user's config failed to load in v3 so we need to fallback
+        originalConfig = await resolveConfig.module({})
+        state.jit = true
+
+        // And warn the user
+        console.error(`Unable to load config file at: ${state.configPath}`)
+        console.error(err)
+        showWarning(connection, 'Tailwind CSS is unable to load your config file', err)
       } finally {
         hook.unhook()
       }

packages/tailwindcss-language-server/src/util/error.ts

@@ -32,6 +32,16 @@ export function showError(
   // }
 }
 
+export function showWarning(
+  connection: Connection,
+  message: string = 'Tailwind CSS',
+  err: any,
+): void {
+  connection.sendNotification('@/tailwindCSS/warn', {
+    message: formatError(message, err, false),
+  })
+}
+
 export function SilentError(message: string) {
   this.name = 'SilentError'
   this.message = message

packages/vscode-tailwindcss/CHANGELOG.md

@@ -10,6 +10,7 @@
 - Make sure custom regexes apply in Vue `<script>` blocks  ([#1177](https://github.com/tailwindlabs/tailwindcss-intellisense/pull/1177))
 - Fix suggestion of utilities with slashes in them in v4 ([#1182](https://github.com/tailwindlabs/tailwindcss-intellisense/pull/1182))
 - Assume 16px font size for `1rem` in media queries ([#1190](https://github.com/tailwindlabs/tailwindcss-intellisense/pull/1190))
+- Show warning when loading a config in v3 fails ([#1191](https://github.com/tailwindlabs/tailwindcss-intellisense/pull/1191))
 
 ## 0.14.3
 

packages/vscode-tailwindcss/src/extension.ts

@@ -532,6 +532,7 @@ export async function activate(context: ExtensionContext) {
     let client = new LanguageClient(CLIENT_ID, CLIENT_NAME, serverOptions, clientOptions)
 
     client.onNotification('@/tailwindCSS/error', showError)
+    client.onNotification('@/tailwindCSS/warn', showWarning)
     client.onNotification('@/tailwindCSS/clearColors', clearColors)
     client.onNotification('@/tailwindCSS/projectInitialized', updateActiveTextEditorContext)
     client.onNotification('@/tailwindCSS/projectReset', updateActiveTextEditorContext)
@@ -548,6 +549,12 @@ export async function activate(context: ExtensionContext) {
       commands.executeCommand('tailwindCSS.showOutput')
     }
 
+    async function showWarning({ message }: ErrorNotification) {
+      let action = await Window.showWarningMessage(message, 'Go to output')
+      if (action !== 'Go to output') return
+      commands.executeCommand('tailwindCSS.showOutput')
+    }
+
     interface DocumentSymbolsRequest {
       uri: string
     }