diff --git a/.gitea/workflows/publish-nuget.yml b/.gitea/workflows/publish-nuget.yml index efa0a33e..bae6ad19 100644 --- a/.gitea/workflows/publish-nuget.yml +++ b/.gitea/workflows/publish-nuget.yml @@ -32,6 +32,10 @@ jobs: run: rm -rf ./artifacts # Publish frontend + - name: Build tailwind styles and extract class list + working-directory: Hosts/Moonlight.Frontend.Host/Styles + run: npm run build + - name: Build project run: dotnet build Moonlight.Frontend --configuration Debug diff --git a/Hosts/Moonlight.Frontend.Host/Moonlight.Frontend.Host.csproj b/Hosts/Moonlight.Frontend.Host/Moonlight.Frontend.Host.csproj index 2ecce0ad..46b3dfe3 100644 --- a/Hosts/Moonlight.Frontend.Host/Moonlight.Frontend.Host.csproj +++ b/Hosts/Moonlight.Frontend.Host/Moonlight.Frontend.Host.csproj @@ -14,11 +14,11 @@ - - + + - + diff --git a/Hosts/Moonlight.Frontend.Host/Styles/extract-classes.mjs b/Hosts/Moonlight.Frontend.Host/Styles/extract-classes.mjs new file mode 100644 index 00000000..8fba7344 --- /dev/null +++ b/Hosts/Moonlight.Frontend.Host/Styles/extract-classes.mjs @@ -0,0 +1,25 @@ +import fs from 'fs'; +import selectorParser from 'postcss-selector-parser'; + +export default function extractTailwindClasses(opts = {}) { + const classSet = new Set(); + + return { + postcssPlugin: 'extract-tailwind-classes', + Rule(rule) { + selectorParser(selectors => { + selectors.walkClasses(node => { + classSet.add(node.value); + }); + }).processSync(rule.selector); + }, + OnceExit() { + const classArray = Array.from(classSet).sort(); + fs.mkdirSync('../../../Moonlight.Frontend/Styles', { recursive: true }); + fs.writeFileSync('../../../Moonlight.Frontend/Styles/Moonlight.Frontend.map', classArray.join('\n')); + console.log(`Extracted classes ${classArray.length}`); + } + }; +} + +extractTailwindClasses.postcss = true; \ No newline at end of file diff --git a/Hosts/Moonlight.Frontend.Host/Styles/package.json b/Hosts/Moonlight.Frontend.Host/Styles/package.json index f4f4d143..ebec5e04 100644 --- a/Hosts/Moonlight.Frontend.Host/Styles/package.json +++ b/Hosts/Moonlight.Frontend.Host/Styles/package.json @@ -1,15 +1,20 @@ { "scripts": { - "tailwind": "npx postcss styles.css -o ../wwwroot/style.min.css --watch", - "tailwind-build": "npx postcss styles.css -o ../wwwroot/style.min.css" + "dev": "npx postcss styles.css -o ../wwwroot/style.min.css --watch", + "dev-build": "npx postcss styles.css -o ../wwwroot/style.min.css", + "build": "cross-env EXTRACT_CLASSES=true npx postcss styles.css -o ../wwwroot/style.min.css" }, "dependencies": { "@tailwindcss/postcss": "^4.1.18", "cssnano": "^7.1.2", "postcss": "^8.5.6", "postcss-cli": "^11.0.1", + "postcss-selector-parser": "^7.1.1", "shadcnblazor": "^1.0.5", "tailwindcss": "^4.1.18", "tw-animate-css": "^1.4.0" + }, + "devDependencies": { + "cross-env": "^10.1.0" } } diff --git a/Hosts/Moonlight.Frontend.Host/Styles/postcss.config.mjs b/Hosts/Moonlight.Frontend.Host/Styles/postcss.config.mjs index 8b9b8fba..3bc7e1bd 100644 --- a/Hosts/Moonlight.Frontend.Host/Styles/postcss.config.mjs +++ b/Hosts/Moonlight.Frontend.Host/Styles/postcss.config.mjs @@ -1,8 +1,18 @@ -export default { - plugins: { - "@tailwindcss/postcss": {}, - "cssnano":{ - preset: 'default' - } - } -} \ No newline at end of file +import tailwindcss from '@tailwindcss/postcss'; +import cssnano from 'cssnano'; +import extractTailwindClasses from './extract-classes.mjs'; + +const plugins = [ + tailwindcss, + cssnano({ + preset: 'default' + }) +]; + +if (process.env.EXTRACT_CLASSES === "true") { + plugins.push(extractTailwindClasses()); +} + +export default { + plugins +}; \ No newline at end of file diff --git a/Moonlight.Frontend/Moonlight.Frontend.csproj b/Moonlight.Frontend/Moonlight.Frontend.csproj index 285b5d63..d7ceaef3 100644 --- a/Moonlight.Frontend/Moonlight.Frontend.csproj +++ b/Moonlight.Frontend/Moonlight.Frontend.csproj @@ -23,7 +23,6 @@ - @@ -32,5 +31,9 @@ - + + + + + \ No newline at end of file diff --git a/Moonlight.Frontend/Moonlight.Frontend.targets b/Moonlight.Frontend/Moonlight.Frontend.targets new file mode 100644 index 00000000..6beede2b --- /dev/null +++ b/Moonlight.Frontend/Moonlight.Frontend.targets @@ -0,0 +1,15 @@ + + + + $(MSBuildProjectDirectory)\bin\Moonlight.Frontend + + + + + + + + + + + \ No newline at end of file diff --git a/Moonlight.Frontend/Styles/Moonlight.Frontend.map b/Moonlight.Frontend/Styles/Moonlight.Frontend.map new file mode 100644 index 00000000..eb218e58 --- /dev/null +++ b/Moonlight.Frontend/Styles/Moonlight.Frontend.map @@ -0,0 +1 @@ +THIS WILL BE GENERATED ON PACKAGE BUILD \ No newline at end of file