blazor-tailwindcss-template
blazor-tailwindcss-template copied to clipboard
Thank you!
Truely I was looking for this since weeks and you made it! Thank you 1000 times!
Just in case here is my project config I have all NPM shit in a folder NpmJS, and I differ between publish and build. Maybe this helps someone else who has the same problem
<Project Sdk="Microsoft.NET.Sdk.Web">
<PropertyGroup>
<TargetFramework>net6.0</TargetFramework>
<IsWebConfigTransformDisabled>true</IsWebConfigTransformDisabled>
<StaticWebAssetBasePath>_content</StaticWebAssetBasePath>
<NodeFiles>NpmJS\</NodeFiles>
</PropertyGroup
<ItemGroup>
<Content Remove="$(NodeFiles)**" />
<None Remove="$(NodeFiles)**" />
<None Include="$(NodeFiles)**" Exclude="$(NodeFiles)node_modules\**" />
</ItemGroup>
<ItemGroup>
<styles Include="$(NodeFiles)src\app.css" />
<Watch Include="@(styles)" />
</ItemGroup>
<Target Name="DeleteExistingBuild" BeforeTargets="ComputeFilesToPublish">
<RemoveDir Directories="$(PublishDir)" />
<Message Importance="high" Text="Cleared publish folder" />
</Target>
<Target Name="NpmInstall" Inputs="$(MSBuildProjectDirectory)\NpmJS\package-lock.json" Outputs="$(BaseIntermediateOutputPath)\NpmJS\package-lock.json">
<Message Importance="high" Text="Restoring dependencies using 'npm'. This may take several minutes..." />
<Exec Command="npm install" WorkingDirectory="$(MSBuildProjectDirectory)\NpmJS" />
<Copy SourceFiles="$(MSBuildProjectDirectory)\NpmJS\package-lock.json" DestinationFolder="$(BaseIntermediateOutputPath)\NpmJS" SkipUnchangedFiles="true" />
</Target>
<Target Name="PostScopedCssCompile" AfterTargets="_GenerateScopedCssFiles" DependsOnTargets="NpmInstall">
<Message Importance="high" Text="Building scoped css..." />
<Exec Command="npx postcss @(_ScopedCssOutputs, ' ') --replace --config $(MSBuildProjectDirectory)\NpmJS" WorkingDirectory="$(MSBuildProjectDirectory)\NpmJS" EnvironmentVariables="TAILWIND_MODE=build" />
</Target>
<Target Name="PostStylesCssCompile" Inputs="@(styles)" Outputs="@(styles->'$(MSBuildProjectDirectory)\wwwroot\css\%(FileName)%(Extension)')" BeforeTargets="CoreBuild">
<Message Importance="high" Text="(CoreBuild) Building styles css" />
<Exec Command="npx postcss @(styles->'src\%(FileName)%(Extension)', ' ') --dir $(MSBuildProjectDirectory)\wwwroot\css --config $(MSBuildProjectDirectory)\NpmJS" WorkingDirectory="$(MSBuildProjectDirectory)\NpmJS" EnvironmentVariables="TAILWIND_MODE=build" />
</Target>
<Target Name="PostStylesCssPublish" Inputs="@(styles)" Outputs="@(styles->'$(PublishDir)\wwwroot\css\%(FileName)%(Extension)')" AfterTargets="ComputeFilesToPublish">
<Message Importance="high" Text="(ComputeFilesToPublish) Building styles css" />
<Exec Command="npx postcss @(styles->'src\%(FileName)%(Extension)', ' ') --dir $(PublishDir)\wwwroot\css --config $(MSBuildProjectDirectory)\NpmJS" WorkingDirectory="$(MSBuildProjectDirectory)\NpmJS" EnvironmentVariables="TAILWIND_MODE=build" />
</Target>
</Project>
Thank you!, that is definitely going to help some of us, will keep the issue open for now, to see if I can add this somewhere in future templates.