I'm currently playing around with a MAUI Blazor app and set up Tailwind CSS instead of the default Bootstrap. This is done through Node.js for which I've set up an NPM script to build the CSS:
"scripts": {
"buildcss": "tailwindcss -o wwwroot/css/custom-tailwind.min.css --minify"
}
In the index.html I load this CSS file: <link rel="stylesheet" href="css/custom-tailwind.min.css" />.
Now, since Tailwind only includes the styles that my app actually uses (to minimize the file size), I want to rebuild this CSS file everytime I build my app. This is currectly done with a post build action:
<Target Name="BuildCSS" AfterTargets="PostBuildEvent">
<Exec Command="npm run buildcss" />
</Target>
The file is generated as expected, but when running the app, it doesn't seem to recognize the file and therefore no styling is loaded. Simply restarting the application after is enough for it to work, which means if the file already exists and is simply overwritten it works, but it annoys me.
Am I using the wrong build action or should this be done in a different way?
As a bonus question, is there a build action that will also be executed during Hot Reload?
I'm currently just testing it for a Windows app (net6.0-windows10.0.19041.0)