Hello, everyone!

I decided to try Webstorm 2025.1.2 after briefly familiarizing myself with VSCode, to compare the two. I heard that Webstorm is much more comfortable and pleasant to use.

But I ran into a problem that I haven't been able to solve for several days now. It surprises me, and I became very interested in figuring out what the problem is.

I am studying TailwindCSS and creating an HTML template using Pnpm, Prettier, and several of its plugins for convenient code formatting, namely:

“prettier-plugin-classnames”: “^0.7.8”,

“prettier-plugin-merge”: “^0.7.4”,

“prettier-plugin-tailwindcss”: “^0.6.12”,

In VSCode, formatting works immediately when saving, all these plugins work as they should, but in Webstorm - no.

I dug through a bunch of articles, consulted AI a bunch of times, but I tried what it advised me to do and got nowhere. I double-checked all the settings and so on... Please tell me what the problem is. I'm sure some obvious little thing is preventing prettier from working as it should.

Here is my .prettierrc file:

{
  "tailwindStylesheet": "./src/css/style.css",
  "arrowParens": "always",
  "bracketSpacing": true,
  "htmlWhitespaceSensitivity": "css",
  "insertPragma": false,
  "jsxSingleQuote": true,
  "printWidth": 80,
  "proseWrap": "always",
  "quoteProps": "as-needed",
  "requirePragma": false,
  "semi": true,
  "singleQuote": true,
  "tabWidth": 2,
  "trailingComma": "all",
  "useTabs": false,
  "plugins": [
    "prettier-plugin-tailwindcss",
    "prettier-plugin-classnames",
    "prettier-plugin-merge"
  ],
  "customAttributes": ["class"],
  "customFunctions": ["clsx", "cn"],
  "overrides": [
    {
      "files": "*.html",
      "options": {
        "parser": "html"
      }
    }
  ]
}

An interesting observation 1:

I check whether changing the order within Tailwind classes and adding a few spaces works. I press CTRL+S. For a moment, a message appears at the bottom right and disappears after a few seconds, but the code is not formatted:

An interesting observation 2:

When I use this command prettier --write src/index.html in the command line, everything works as I expect!

Additional information:

- I installed prettier globally using npm (it didn't work with pnpm), but then I removed it. Now it is only installed locally in the project. AI said that the IDE may conflict due to two different versions.

- I tried to specify full paths for plugins in .prettierrc

- I tried abandoning pnpm and going back to npm

To be honest, I've tried so many things that I can't even remember them all. Maybe someone else has encountered this?

Thank you in advance! All the best.