Skip to content

tailwindcss-intellisense extension not working properly #1010

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Closed
ShaquibKhanhub opened this issue Jul 3, 2024 · 6 comments
Closed

tailwindcss-intellisense extension not working properly #1010

ShaquibKhanhub opened this issue Jul 3, 2024 · 6 comments

Comments

@ShaquibKhanhub
Copy link

What version of VS Code are you using?

Most latest ver.

What version of Tailwind CSS IntelliSense are you using?
v0.12.3

What version of Tailwind CSS are you using?

"^3.4.1"

What package manager are you using?

npm

What operating system are you using?

Windows

Tailwind config

import type { Config } from "tailwindcss"

const config = {
darkMode: ["class"],
content: [
'./pages//*.{ts,tsx}',
'./components/
/.{ts,tsx}',
'./app/**/
.{ts,tsx}',
'./src/**/*.{ts,tsx}',
],
prefix: "",
theme: {
container: {
center: true,
padding: "2rem",
screens: {
"2xl": "1400px",
},
},
extend: {
colors: {
border: "hsl(var(--border))",
input: "hsl(var(--input))",
ring: "hsl(var(--ring))",
background: "hsl(var(--background))",
foreground: "hsl(var(--foreground))",
primary: {
DEFAULT: "hsl(var(--primary))",
foreground: "hsl(var(--primary-foreground))",
},
secondary: {
DEFAULT: "hsl(var(--secondary))",
foreground: "hsl(var(--secondary-foreground))",
},
destructive: {
DEFAULT: "hsl(var(--destructive))",
foreground: "hsl(var(--destructive-foreground))",
},
muted: {
DEFAULT: "hsl(var(--muted))",
foreground: "hsl(var(--muted-foreground))",
},
accent: {
DEFAULT: "hsl(var(--accent))",
foreground: "hsl(var(--accent-foreground))",
},
popover: {
DEFAULT: "hsl(var(--popover))",
foreground: "hsl(var(--popover-foreground))",
},
card: {
DEFAULT: "hsl(var(--card))",
foreground: "hsl(var(--card-foreground))",
},
},
borderRadius: {
lg: "var(--radius)",
md: "calc(var(--radius) - 2px)",
sm: "calc(var(--radius) - 4px)",
},
keyframes: {
"accordion-down": {
from: { height: "0" },
to: { height: "var(--radix-accordion-content-height)" },
},
"accordion-up": {
from: { height: "var(--radix-accordion-content-height)" },
to: { height: "0" },
},
},
animation: {
"accordion-down": "accordion-down 0.2s ease-out",
"accordion-up": "accordion-up 0.2s ease-out",
},
},
},
plugins: [require("tailwindcss-animate")],
} satisfies Config

export default config

VS Code settings

// Paste your VS Code settings in JSON format here

Im not getting which settings i should provide like extention settings or what ,and you can tell me how to do it on mail : shaquibkhanrdx34@gmail.com

Reproduction URL

A public GitHub repo that includes a minimal reproduction of the bug. Please do not link to your actual project, what we need instead is a minimal reproduction in a fresh project without any unnecessary code. This means it doesn't matter if your real project is private/confidential, since we want a link to a separate, isolated reproduction anyways.

Describe your issue

Describe the problem you're seeing, any important steps to reproduce and what behavior you expect instead.

@ShaquibKhanhub
Copy link
Author

Extension is not working properly mainly two things .

  1. Autocomplete not working
  2. when I'm hovering on any classes like text-lg it's should show me details in classic CSS .

@erquhart
Copy link

erquhart commented Jul 3, 2024

Stopped working about a week ago.

@ShaquibKhanhub
Copy link
Author

ShaquibKhanhub commented Jul 3, 2024

Stopped working about a week ago.

Yeah but i thought it will work after sometime but it's not 🙂

@thecrypticace
Copy link
Contributor

thecrypticace commented Jul 3, 2024

Closing in favor of #988 which is where we're tracking things.

@ShaquibKhanhub @erquhart Can you both update to the v0.12.4 release please. If you're still having problems can you provide your VSCode settings and details about your project in that issue? (A full reproduction would be very, very useful)

@ShaquibKhanhub
Copy link
Author

What version of VS Code are you using?

Most latest ver.

What version of Tailwind CSS IntelliSense are you using? v0.12.3

What version of Tailwind CSS are you using?

"^3.4.1"

What package manager are you using?

npm

What operating system are you using?

Windows

Tailwind config

import type { Config } from "tailwindcss"

const config = { darkMode: ["class"], content: [ './pages//*.{ts,tsx}', './components//.{ts,tsx}', './app/**/.{ts,tsx}', './src/**/*.{ts,tsx}', ], prefix: "", theme: { container: { center: true, padding: "2rem", screens: { "2xl": "1400px", }, }, extend: { colors: { border: "hsl(var(--border))", input: "hsl(var(--input))", ring: "hsl(var(--ring))", background: "hsl(var(--background))", foreground: "hsl(var(--foreground))", primary: { DEFAULT: "hsl(var(--primary))", foreground: "hsl(var(--primary-foreground))", }, secondary: { DEFAULT: "hsl(var(--secondary))", foreground: "hsl(var(--secondary-foreground))", }, destructive: { DEFAULT: "hsl(var(--destructive))", foreground: "hsl(var(--destructive-foreground))", }, muted: { DEFAULT: "hsl(var(--muted))", foreground: "hsl(var(--muted-foreground))", }, accent: { DEFAULT: "hsl(var(--accent))", foreground: "hsl(var(--accent-foreground))", }, popover: { DEFAULT: "hsl(var(--popover))", foreground: "hsl(var(--popover-foreground))", }, card: { DEFAULT: "hsl(var(--card))", foreground: "hsl(var(--card-foreground))", }, }, borderRadius: { lg: "var(--radius)", md: "calc(var(--radius) - 2px)", sm: "calc(var(--radius) - 4px)", }, keyframes: { "accordion-down": { from: { height: "0" }, to: { height: "var(--radix-accordion-content-height)" }, }, "accordion-up": { from: { height: "var(--radix-accordion-content-height)" }, to: { height: "0" }, }, }, animation: { "accordion-down": "accordion-down 0.2s ease-out", "accordion-up": "accordion-up 0.2s ease-out", }, }, }, plugins: [require("tailwindcss-animate")], } satisfies Config

export default config

VS Code settings

User settings
{
"emmet.useInlineCompletions": true,
"explorer.confirmDelete": false,
"liveServer.settings.AdvanceCustomBrowserCmdLine": "chrome",
"liveServer.settings.ignoreFiles": [
".vscode/",
"
/.scss",
"**/
.sass",
"/*.ts"
],
"liveServer.settings.port": 0,
"[html]": {
"editor.defaultFormatter": "esbenp.prettier-vscode"
},
"editor.wordWrap": "on",
"[javascript]": {
"editor.defaultFormatter": "esbenp.prettier-vscode"
},
"code-runner.runInTerminal": true,
"editor.accessibilitySupport": "on",
"[jsonc]": {
"editor.quickSuggestions": {
"other": "inline"
}
},
"[json]": {
"editor.suggest.snippetsPreventQuickSuggestions": true
},
"editor.quickSuggestions": {
"strings": "inline"
},
"tabnine.experimentalAutoImports": true,
"liveServer.settings.donotShowInfoMsg": true,
"[javascriptreact]": {
"editor.defaultFormatter": "esbenp.prettier-vscode"
},
"editor.fontLigatures": true,
"editor.fontFamily": "'cascadia code',Consolas,'Courier New',monospace",
"remote.SSH.remotePlatform": {
"sandbox.7r4v79.csb": "linux"
},
"[css]": {
"editor.defaultFormatter": "vscode.css-language-features"
},
"files.autoSave": "afterDelay",
"quokka.compactMessageOutput": true,
"tabnine.debug": true,
"tabnine.disableFileRegex": [],
"[scss]": {
"editor.defaultFormatter": "esbenp.prettier-vscode"
},
"editor.formatOnSave": true,
"editor.defaultFormatter": "esbenp.prettier-vscode",
"terminal.integrated.env.windows": {},
"console-ninja.toolsToEnableSupportAutomaticallyFor": {
"live-server-extension": true,
"live-preview-extension": true
},
"liveServer.settings.donotVerifyTags": true,
"editor.cursorBlinking": "expand",
"editor.cursorSmoothCaretAnimation": "on",
"terminal.integrated.env.linux": {},
"git.autofetch": true,
"gitlens.graph.layout": "editor",
"liveServer.settings.ChromeDebuggingAttachment": false,
"liveServer.settings.CustomBrowser": "microsoft-edge",
"console-ninja.featureSet": "Community",
"nxConsole.showNodeVersionOnStartup": false,
"terminal.integrated.enableMultiLinePasteWarning": false,
"files.exclude": {
"
/.git": false,
"/.trunk/*actions/": true,
"
/.trunk/*logs/": true,
"/.trunk/*notifications/": true,
"
/.trunk/*out/": true,
"/.trunk/plugins/": true
},
"html-to-css-autocompletion.getSelectorsFromFileTypes": ["html", "php"],
"terminal.integrated.fontWeightBold": "bold",
"terminal.integrated.cursorBlinking": true,
"window.zoomLevel": 1,
"editor.fontSize": 16,
"workbench.editorAssociations": {
"
.md": "default"
},
"accessibility.signals.lineHasError": {
"sound": "off"
},
"accessibility.signals.lineHasFoldedArea": {
"sound": "off"
},
"accessibility.signals.lineHasBreakpoint": {
"sound": "off"
},
"accessibility.signals.lineHasInlineSuggestion": {
"sound": "off"
},
"accessibility.signals.onDebugBreak": {
"sound": "off"
},
"accessibility.signals.noInlayHints": {
"sound": "off"
},
"accessibility.signals.taskCompleted": {
"sound": "off"
},
"accessibility.signals.taskFailed": {
"sound": "off"
},
"accessibility.signals.notebookCellCompleted": {
"sound": "off"
},
"accessibility.signals.notebookCellFailed": {
"sound": "off"
},
"accessibility.signals.diffLineInserted": {
"sound": "off"
},
"accessibility.signals.diffLineDeleted": {
"sound": "off"
},
"accessibility.signals.diffLineModified": {
"sound": "off"
},
"javascript.updateImportsOnFileMove.enabled": "always",
"github.copilot.editor.enableAutoCompletions": true,
"files.watcherExclude": {
"
/.trunk/*actions/": true,
"/.trunk/*logs/": true,
"
/.trunk/*notifications/": true,
"/.trunk/*out/": true,
"
/.trunk/*plugins/": true
},
"autoimport.doubleQuotes": true,
"workbench.colorTheme": "Ayu Light",
"vscode-edge-devtools.webhintInstallNotification": true,
"[typescriptreact]": {
"editor.defaultFormatter": "vscode.typescript-language-features"
},
"terminal.integrated.defaultProfile.windows": "Git Bash",
"cSpell.userWords": ["cloudinary", "Shaquib"],
"tailwindCSS.experimental.configFile": null,
"workbench.iconTheme": "material-icon-theme"
}


Im not getting which settings i should provide like extention settings or what ,and you can tell me how to do it on mail : [shaquibkhanrdx34@gmail.com](mailto:shaquibkhanrdx34@gmail.com)

**Reproduction URL**

A public GitHub repo that includes a minimal reproduction of the bug. **Please do not link to your actual project**, what we need instead is a _minimal_ reproduction in a fresh project without any unnecessary code. This means it doesn't matter if your real project is private/confidential, since we want a link to a separate, isolated reproduction anyways.

Still it's not working even when i hover on any tailwind classes which i have written and also not giving any  IntelliSense

Describe the problem you're seeing, any important steps to reproduce and what behavior you expect instead.

@ShaquibKhanhub
Copy link
Author

i have provide my user settings.json it's after very long time but after that issue i was not using tailwind for CSS

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

3 participants