MSBuild integration for using tailwindcss with dotnet projects.

Prerequisites

The Tailwind CSS CLI tool must be installed locally (usually in the same directory as the project file).

dotnet new tool-manifest # if you this is the first tool you are installing in this repo dotnet tool install --local tailwindcss.cli

See https://github.com/duaneedwards/tailwindcss.cli for more information regarding the tailwindcss cli dotnet tool.

Configuration

Project file mode

Inside the project file that the tailwindcss.msbuild package was installed to, you can configure the tailwindcss cli tool arguments to be used by defining properties as follows:

<PropertyGroup> <TailwindCSSReleaseBuildArguments>-i input.css -o wwwroot/css/output.css --minify</TailwindCSSReleaseBuildArguments> <TailwindCSSDebugBuildArguments>-i input.css -o wwwroot/css/output.css</TailwindCSSDebugBuildArguments> </PropertyGroup>

Any configuration name that matches the property name format TailwindCSS<ConfigurationName>BuildArguments is supported.

Config file mode

This tool expects the tailwind.config.js to live in the same directory as the project file itself.

Configuration specific build commands will be loaded from a tailwind.msbuild.json file if found present alongside the project file.

You can use the dotnet tailwind css cli tool to generate the default config file by running dotnet tailwindcss msbuild init

{ "build": [ { "configuration": "Release", "arguments": "-i tailwind.css -o wwwroot/css/build.css --verbose --minify" }, { "configuration": "Debug", "arguments": "-i tailwind.css -o wwwroot/css/build.css --verbose" } ] }

Environment variable mode

In the case that you would like to opt out of the convention based configuration, perhaps during CI builds, there

Simply create an environment variable with the name TAILWINDCSS_MSBUILD_ARGUMENTS and set it's value to the arguments to use instead of any discovered convention based configuration.

For example:

$env:TAILWINDCSS_MSBUILD_ARGUMENTS="-i ""tailwind.css"" -c ""../someOtherLocation/tailwind.config.js"" -o ""wwwroot/css/build.css""" SET TAILWINDCSS_MSBUILD_ARGUMENTS="-i ""tailwind.css"" -c ""../someOtherLocation/tailwind.config.js"" -o ""wwwroot/css/build.css"""

Example configurations

# Use a specific tailwind.config.js file: dotnet tailwindcss -i "tailwind.css" -c "../someOtherLocation/tailwind.config.js" -o "wwwroot/css/build.css"