SASS files containing // (single line comment) and @import together makes Tailwind Intellisense to stop working

[mamunonweb]

What version of VS Code are you using?

v1.92.2 (Windows)

What version of Tailwind CSS IntelliSense are you using?

v0.12.7

What version of Tailwind CSS are you using?

For example: v3.3.3

What package manager are you using?

npm

What operating system are you using?

Windows

Tailwind config

import containerQueriesPlugin from '@tailwindcss/container-queries'
import defaultTheme from 'tailwindcss/defaultTheme'

/** @type {import('tailwindcss').Config} */
export default {
  content: ['./index.html', './src/**/*.{js,ts,jsx,tsx}'],
  corePlugins: {
    preflight: false
  },
  prefix: 'tw-',
  important: true,
  theme: {
    extend: {
      fontFamily: {
        sans: ['Inter', ...defaultTheme.fontFamily.sans]
      },
      boxShadow: {
        around: 'rgba(100, 100, 115, 0.25) 0px 7.5px 30px 0px'
      },
      animation: {
        up: 'up 250ms ease-in-out'
      }
    },
    screens: {
      sm: '576px', // Bootstrap: <576px
      md: '768px', // Bootstrap: ≥576px
      lg: '992px', // Bootstrap: ≥768px
      xl: '1200px', // Bootstrap: ≥992px
      xxl: '1400px' // Bootstrap: ≥1200px
    }
  },
  plugins: [containerQueriesPlugin]
}

VS Code settings

{
  "editor.fontFamily": "'Fira Code Medium', 'Roboto Mono', 'JetBrains Mono Medium', Consolas, 'Courier New', monospace, 'Noto Sans Bengali'",
  "editor.tabSize": 2,
  "window.commandCenter": false,
  "vim.useSystemClipboard": true,
  "vim.smartRelativeLine": true,
  "emmet.showExpandedAbbreviation": "inMarkupAndStylesheetFilesOnly",
  "window.menuBarVisibility": "toggle",
  "javascript.updateImportsOnFileMove.enabled": "never",
  "breadcrumbs.enabled": false,
  "editor.fontLigatures": false,
  "gitlens.graph.minimap.enabled": false,
  "remote.SSH.remotePlatform": {
    "rnd": "linux"
  },
  "github.copilot.enable": {
    "*": true,
    "plaintext": false,
    "markdown": false,
    "scminput": false
  },
  "git.suggestSmartCommit": false,
  "git.autofetch": true,
  "editor.stickyScroll.enabled": false,
  "workbench.tree.enableStickyScroll": false,
  "diffEditor.ignoreTrimWhitespace": true,
  "diffEditor.renderSideBySide": true,
  "[html]": {
    "editor.defaultFormatter": "esbenp.prettier-vscode"
  },
  "[json]": {
    "editor.defaultFormatter": "esbenp.prettier-vscode"
  },
  "[javascript]": {
    "editor.defaultFormatter": "esbenp.prettier-vscode"
  },
  "[typescriptreact]": {
    "editor.defaultFormatter": "esbenp.prettier-vscode"
  },
  "[typescript]": {
    "editor.defaultFormatter": "esbenp.prettier-vscode"
  },
  "editor.defaultFormatter": "esbenp.prettier-vscode",
  "editor.cursorBlinking": "solid",
  "diffEditor.hideUnchangedRegions.enabled": true
}

Reproduction URL

Don't have a public one!

Describe your issue

SASS files containing // (single line comment) and @import together makes Tailwind Intellisense to stop working

Only comments (single line) or only imports are fine

// only comments (this is good)

@import './init';

Problem when they are together

// comments with imports (this is not good)
@import './init';

[Ali-ovo]

I have the same error

[philipp-spiess]

Hey @mamunonweb! Thanks for reporting this and sorry for the troubles! We just released v0.12.8 of the VS Code extension with a fix that resolves this issue. If you still have issues, please let us know!