feat: set up CSS compilation

src2/app.ts

@@ -1,6 +1,8 @@
 import express, { Request, Response, NextFunction, RequestHandler, json as BodyParserJson } from 'express';
 import fs from 'fs-extra';
 import { path, isProd } from '@tycrek/joint';
+import { epcss } from '@tycrek/express-postcss';
+import tailwindcss from 'tailwindcss';
 import { log } from './log';
 import { ServerConfiguration } from 'ass';
 
@@ -63,6 +65,18 @@ async function main() {
     app.use(BodyParserJson());
     app.use(assMetaMiddleware(serverConfig.port, serverConfig.proxied));
 
+    // CSS
+    app.use('/.css', epcss({
+        cssPath: path.join('tailwind2.css'),
+        plugins: [
+            tailwindcss,
+            (await import('autoprefixer')).default(),
+            (await import('cssnano')).default(),
+            (await import('@tinycreek/postcss-font-magician')).default(),
+        ],
+        warn: (warning: Error) => log.warn('PostCSS', warning.toString())
+    }));
+
     app.get('/.ass.host', (req, res) => res.send(req.ass.host));
 
     // Routing

tailwind.config.js

@@ -40,7 +40,7 @@ module.exports = {
 	plugins: [
 		//require('tailwindcss-textshadow')
 	],
-	content: ['./views/**/*.pug'],
+	content: ['./views2/**/*.pug'],
 	theme: {
 		extend: {
 			fontFamily: {

tailwind2.css

@@ -0,0 +1,9 @@
+@tailwind base;
+@tailwind components;
+@tailwind utilities;
+
+@layer base {}
+
+@layer components {}
+
+@layer utilities {}