#astro build does not include TailwindCSS

8 messages · Page 1 of 1 (latest)

twilit anchor
#

I setup a new Astro project with TailwindCSS, running the website from the dev server works fine, but when building the static site, it does not seem to include TailwindCSS in the final dist folder therefore making the website display in standard HTML.

package.json

{
  "name": "",
  "type": "module",
  "version": "0.0.1",
  "scripts": {
    "dev": "astro dev",
    "build": "astro build",
    "preview": "astro preview",
    "astro": "astro"
  },
  "dependencies": {
    "@astrojs/check": "^0.9.5",
    "@tailwindcss/vite": "^4.1.17",
    "astro": "^5.15.4",
    "tailwindcss": "^4.1.17",
    "typescript": "^5.9.3"
  }
}

astro.config.mjs

// @ts-check
import { defineConfig } from "astro/config";
import tailwindcss from "@tailwindcss/vite";

// https://astro.build/config
export default defineConfig({
  vite: {
    plugins: [tailwindcss()],
  },
});
twilit anchor
#

I was able to generate a css file by using the --devOutput flag for the build command

nova haven
twilit anchor
#

I figured it out now. I didn't notice the css file and GitHub Pages wasn't picking it up properly

nova haven
#

it's under `dist/_astro/[page-name].jibberish.css

twilit anchor
#

I fixed it by setting up the Workflow properly

nova haven
#

glad to hear you found a solution.