Extension formatting conflicts with prettier-plugin-tailwindcss

What version of VS Code are you using?

Actually using Cursor - my versions are:

VSCode Version: 1.93.1 Cursor Version: 0.42.3

What version of Tailwind CSS IntelliSense are you using?

v0.12.12

What version of Tailwind CSS are you using?

v3.4.10

What package manager are you using?

npm

What operating system are you using?

MacOS

Tailwind config

import { type Config } from 'tailwindcss'
import animatePlugin from 'tailwindcss-animate'
import radixPlugin from 'tailwindcss-radix'
import { homePreset } from './app/routes/_home+/tailwind-preset'
import { extendedTheme } from './app/utils/extended-theme'

export default {
  content: ['./app/**/*.{ts,tsx,jsx,js}'],
  safelist: ['ml-4', '-indent-4'],
  darkMode: 'class',
  theme: {
    container: {
      center: true,
      padding: '2rem',
      screens: {
        '2xl': '1400px',
      },
    },
    extend: extendedTheme,
  },
  presets: [homePreset],
  plugins: [animatePlugin, radixPlugin],
} satisfies Config

VS Code settings

{
  "workbench.colorTheme": "Monokai",
  "security.workspace.trust.untrustedFiles": "open",
  "editor.defaultFormatter": "esbenp.prettier-vscode",
  "eslint.format.enable": true,
  "editor.codeActionsOnSave": {
    "source.fixAll": "explicit"
  },
  "eslint.validate": ["typescript"],
  "editor.detectIndentation": false,
  "editor.insertSpaces": true,
  "editor.tabSize": 2,
  "security.promptForLocalFileProtocolHandling": false,
  "explorer.confirmDelete": false,
  "javascript.updateImportsOnFileMove.enabled": "always",
  "[markdown]": {
    "editor.defaultFormatter": "esbenp.prettier-vscode"
  },
  "typescript.updateImportsOnFileMove.enabled": "always",
  "javascript.preferences.autoImportFileExcludePatterns": ["build/"],
  "typescript.preferences.autoImportFileExcludePatterns": ["build/"],
  "typescript.preferences.importModuleSpecifierEnding": "minimal",
  "yaml.format.enable": false,
  "eslint.workingDirectories": ["./"],
  "github.copilot.editor.enableAutoCompletions": true,
  "yaml.customTags": [
    "!And",
    "!And sequence",
    "!If",
    "!If sequence",
    "!Not",
    "!Not sequence",
    "!Equals",
    "!Equals sequence",
    "!Or",
    "!Or sequence",
    "!FindInMap",
    "!FindInMap sequence",
    "!Base64",
    "!Join",
    "!Join sequence",
    "!Cidr",
    "!Ref",
    "!Sub",
    "!Sub sequence",
    "!GetAtt",
    "!GetAZs",
    "!ImportValue",
    "!ImportValue sequence",
    "!Select",
    "!Select sequence",
    "!Split",
    "!Split sequence"
  ],
  "workbench.settings.applyToAllProfiles": [
    "javascript.preferences.importModuleSpecifierEnding",
    "typescript.preferences.importModuleSpecifierEnding"
  ],
  "javascript.suggest.autoImports": false,
  "javascript.preferences.importModuleSpecifierEnding": "minimal",
  "diffEditor.hideUnchangedRegions.enabled": true,
  "workbench.editor.wrapTabs": true,
  "editor.quickSuggestions": {
    "strings": "on"
  },
  "editor.formatOnSave": true
}

Reproduction URL

There is a repro link of the behavior on this comment: https://github.com/tailwindlabs/prettier-plugin-tailwindcss/issues/244#issuecomment-2049543859

Describe your issue

re: https://github.com/tailwindlabs/prettier-plugin-tailwindcss/issues/244

When I disable your extension, the differences in formatting in VSCode and the prettier CLI are gone. This leads me to believe this extension is a source of the unwanted behavior.

Love the extension otherwise, though!

tailwindlabs / tailwindcss-intellisense

Extension formatting conflicts with prettier-plugin-tailwindcss #1080