ProcureSoftware.Blazor.Tailwind 1.0.1

dotnet add package ProcureSoftware.Blazor.Tailwind --version 1.0.1
NuGet\Install-Package ProcureSoftware.Blazor.Tailwind -Version 1.0.1
This command is intended to be used within the Package Manager Console in Visual Studio, as it uses the NuGet module's version of Install-Package.
<PackageReference Include="ProcureSoftware.Blazor.Tailwind" Version="1.0.1" />
For projects that support PackageReference, copy this XML node into the project file to reference the package.
paket add ProcureSoftware.Blazor.Tailwind --version 1.0.1
#r "nuget: ProcureSoftware.Blazor.Tailwind, 1.0.1"
#r directive can be used in F# Interactive and Polyglot Notebooks. Copy this into the interactive tool or source code of the script to reference the package.
// Install ProcureSoftware.Blazor.Tailwind as a Cake Addin
#addin nuget:?package=ProcureSoftware.Blazor.Tailwind&version=1.0.1

// Install ProcureSoftware.Blazor.Tailwind as a Cake Tool
#tool nuget:?package=ProcureSoftware.Blazor.Tailwind&version=1.0.1

Use TailwindCSS with Blazor

Description

This package nuget package adds a build step to install TailwindCSS via NPM and run it. It includes a config file for Tailwind that scans any razor files for Tailwind utility classes. By default it will output the generated CSS file in the wwwroot/app.css file of the main project being built.

All default variables can be over written in your csproj file.

Variables and Defaults

  • <NodeCli>npm</NodeCli>
  • <NodeXCli>npx</NodeXCli>
  • <TailwindCssConfigFile>$(MSBuildThisFileDirectory)../content/tailwind.config.js</TailwindCssConfigFile>
  • <TailwindCssCli>tailwindcss</TailwindCssCli>, this command will follow the <NodeXCli> variable
  • <TailwindCssOutputFile>$(MSBuildProjectDirectory)/wwwroot/app.css</TailwindCssOutputFile>
  • <TailwindCssInputFile>$(MSBuildThisFileDirectory)../content/input.css</TailwindCssInputFile>
  • <TailwindCssMinify>false</TailwindCssMinify>, Should TailwindCSS minify its out put. This is case sensitive only true or false valid
  • <TailwindCssWorkingDirectory>$(MSBuildProjectDirectory)/../</TailwindCssWorkingDirectory>, The directory to run the tailwind command from, we default to the level above current project directory in order to glob any components that may be in other project folders within the solution directory

Example

The repo can be cloned, the example project is just the default Blazor project with Bootstrap removed and all CSS replaced with Tailwind

Product Compatible and additional computed target framework versions.
.NETPlatform dotnet is compatible. 
Compatible target framework(s)
Included target framework(s) (in package)
Learn more about Target Frameworks and .NET Standard.

This package has no dependencies.

NuGet packages

This package is not used by any NuGet packages.

GitHub repositories

This package is not used by any popular GitHub repositories.

Version Downloads Last updated
1.0.1 60 6/29/2024
1.0.0 52 6/29/2024