theron-wang / VS2022-Editor-Support-for-Tailwind-CSS

Unofficial VS2022 Tailwind CSS extension for IntelliSense, linting, sorting, and more to enhance the development experience in Visual Studio 2022.
https://marketplace.visualstudio.com/items?itemName=TheronWang.TailwindCSSIntellisense
MIT License
86 stars 5 forks source link

Expected bugs/behaviour when using extension without NPM #38

Closed DavidAbraham082 closed 4 months ago

DavidAbraham082 commented 5 months ago

I'm working on a fairly lightweight UI project and don't feel it's worth it to install npm just for the sake of having tailwind, so I'm using the standalone tailwind.exe. I realise this extension expects the user to have npm installed, what kind of bugs or weird behaviour should I expect?

Intellisense and autocompletion seem to work fine, and I'm not using the build features so I'm not sure if they're affected (I'm using a custom Target in the csproj to build the tailwind css file)

theron-wang commented 5 months ago

Everything should work as expected if you don’t have npm installed. The extension will probably log an error each time you build, however, since it calls npx each time it builds. You can either: 1) turn off building altogether in Options > Tools > Tailwind CSS IntelliSense or 2) specify the path of your standalone tailwind.exe in Options > Tools > Tailwind CSS IntelliSense and set UseCli in your tailwind.extension.json to true (although it does sound like 1) would be a better option in your case)

That being said, if you don’t have node installed on your computer, your tailwind.config.js file will not be read properly, so IntelliSense won’t know anything about your custom styles.

DavidAbraham082 commented 5 months ago

Thank you~!

The extension will probable log an error on build

Yeah, I noticed that, that's actually what prompted the question.

Turn off building Specify tailwind.exe path

I'm not sure what you mean, I can't see the setting for the standalone executable. I've attached a screenshot of my settings and my extension.json

Tools > Options > Tailwind CSS IntelliSense fig: Tools > Options > Tailwind CSS IntelliSense

tailwind.extension.json:

{
  "ConfigurationFile": "tailwind.config.js",
  "InputCssFile": "wwwroot\\css\\app.css",
  "OutputCssFile": "wwwroot\\css\\tailwind.css"
}
theron-wang commented 5 months ago

It looks like you are on an older version—if you update to 1.2.4 you should be able to see it.

Hope this helps!