Using Statiq processes for tailwind commands

docs/Docs.csproj

@@ -31,7 +31,7 @@
   </ItemGroup>
 
   <ItemGroup>
-    <PackageReference Include="Statiq.Web" Version="1.0.0-beta.26" />
+    <PackageReference Include="Statiq.Web" Version="1.0.0-beta.27" />
     <PackageReference Include="MinVer" PrivateAssets="All" Version="2.3.1" />
   </ItemGroup>
 

docs/Program.cs

@@ -22,6 +22,11 @@ namespace Docs
                 .AddShortcode("Alert", typeof(AlertShortcode))
                 .AddShortcode("AsciiCast", typeof(AsciiCastShortcode))
                 .AddPipelines()
+                .AddProcess(ProcessTiming.Initialization, _ => new ProcessLauncher("npm", "install")
+                {
+                    LogErrors = false
+                })
+                .AddProcess(ProcessTiming.AfterExecution, "npm", "run", "build:tailwind")
                 .RunAsync();
 
         private static Config<string> ConfigureEditLink()

docs/README.md

@@ -1,6 +1,6 @@
 # Documentation
 
-To start contributing to the [Spectre.Console](https://github.com/spectreconsole/spectre.console) documentation, you will need the [.NET Core SDK](https://dot.net) 3.1 or higher.
+To start contributing to the [Spectre.Console](https://github.com/spectreconsole/spectre.console) documentation, you will need the [.NET Core SDK](https://dot.net) 5.0.202 or higher (as defined in the repository root `global.json` file).
 
 ## Running Preview Site
 
@@ -10,15 +10,11 @@ The documentation site uses [Statiq](https://statiq.dev), a static site generato
 > Preview.ps1
 ```
 
-After the build is complete, you can navigate to [http://localhost:5080/spectre.console](http://localhost:5080/spectre.console).
+After the build is complete, you can navigate to [http://localhost:5080](http://localhost:5080).
 
-**Note that the site runs under a virtual directory.**
+## Npm
 
-## Building the CSS
-
-The documentation uses tailwind for the CSS. Committed to the repository is a large 4gb file with all possible styles at `assets/style.css`. This file is generated from the root files tailwind.config.js and tailwind.css. Any changes to the overall design style (e.g. colors, markdown styling, etc) can be made in these two files.
-
- For production, `npm run build:tailwind` should be ran post Statiq build. This process will look at all the styles in the HTML and prune the tailwind file down to a much more manageable 30kb or so file.
+The site uses some tools from the JavaScript ecosystem including npm. While Statiq will execute `npm install` and other commands as needed, you need to have [npm installed](https://www.npmjs.com/get-npm) before running a site build.
 
 ## Editing Content
 
@@ -27,7 +23,7 @@ The documentation is written using [Markdown](https://www.markdownguide.org/basi
 Markdown files can be found under the following directories:
 
 - [/input](./input)
-  - [/appendix](./input/appendix)
+- [/appendix](./input/appendix)
     
 ## Editing Layout
 

docs/package.json

@@ -4,7 +4,7 @@
   "description": "Docs for Spectre.Console",
   "main": "index.js",
   "scripts": {
-    "build:tailwind": "tailwindcss build ./tailwind.css -o ./input/assets/styles.css",
+    "build:tailwind": "tailwindcss build ./tailwind.css -o ./output/assets/styles.css",
     "build": "cross-env NODE_ENV=production tailwind build tailwind.css -o ./output/assets/styles.css"
   },
   "repository": {