CSS Intellisense not working

This issue has been tracked since 2023-01-16.

tailwindlabs/tailwindcss-intellisense#663 (comment)
It is bug on module side

nazar1ua wrote this answer on 2023-01-17

I'm sorry, I looked into module code, and saw that it is problem on @tailwindlabs side with resolveConfig.js file

nazar1ua wrote this answer on 2023-01-17

But as a temporary workaround we can do this (at https://github.com/nuxt-modules/tailwindcss/blob/main/src/module.ts#L142-L148):

    const resolveConfig: any = await import('tailwindcss/resolveConfig.js').then(r => r.default || r)
    const resolvedConfig = resolveConfig(tailwindConfig)
    resolvedConfig.plugins = []
    addTemplate({
      filename: 'tailwind.config.cjs',
      getContents: () => `module.exports = ${JSON.stringify(resolvedConfig, null, 2)}`,
      write: true
    })

nazar1ua wrote this answer on 2023-01-17

Can I open pr @Atinux?

Atinux wrote this answer on 2023-01-18

Sure thing!

leo91000 wrote this answer on 2023-01-24

For those who can't wait the fix, you can use pnpm patch @nuxtjs/tailwindcss and modify the dist/module.mjs with the @nazar1ua modification

tkofh wrote this answer on 2023-02-16

The current fix solves the base resolved configuration, but it does not handle plugins from Tailwind Presets.

Reproduction: https://stackblitz.com/edit/nuxt-starter-afebar

I believe we could expand upon the fix like this:

const resolveConfig: any = await import("tailwindcss/resolveConfig.js").then((r) => r.default || r)
const resolvedConfig = resolveConfig(tailwindConfig)
resolvedConfig.plugins = []
for (const preset of resolvedConfig.presets) {
  if(preset.plugins != null) {
    preset.plugins = []
  }
}
addTemplate({
  filename: "tailwind.config.cjs",
  getContents: () => `module.exports = ${JSON.stringify(resolvedConfig, null, 2)}`,
  write: true,
})

Can I open a PR to add this?

nazar1ua wrote this answer on 2023-02-16

Yes

ERPedersen wrote this answer on 2023-02-23

This problem also occurs for me when using purge.options.safelist or just safelist in the root of the tailwind config. If i remove any of these properties, the intellisense starts working again.

Example 1

tailwind.config.js:

export default {
  purge: {
    options: {
      safelist: [
        { pattern: /(bg|text)-./ },
      ],
    },
  },
}

tailwind.config.cjs:

module.exports = {
  'purge': {
    'options': {
      'safelist': [
        {
          'pattern': {},
        },
      ],
    },
  },
  'safelist': [
    {
      'pattern': {},
    },
  ],
};

Example 2 (Tailwind ^3)

tailwind.config.js:

export default {
  safelist: [
    { pattern: /(bg|text)-./ },
  ],
}

tailwind.config.cjs:

module.exports = {
  "safelist": [
    {
      "pattern": {}
    }
  ],
}

ineshbose wrote this answer on 2023-03-13

Is this still being experienced? This has not been an issue for me recently - I'm not sure what fixed it, maybe the extension was updated in the background, but all intellisense is working flawlessly now.

Your Name

Your Comment

More Details About Repo

Owner Name	nuxt-modules
Repo Name	tailwindcss
Full Name	nuxt-modules/tailwindcss
Language	TypeScript
Created Date	2019-04-04
Updated Date	2023-03-29
Star Count	1285
Watcher Count	12
Fork Count	157
Issue Count	57

YOU MAY BE INTERESTED

Issue Title	Created Date	Updated Date