How to properly set up Vite, Express, Tailwind web app-CodePudding

Scenario:
I am making a basic web app using Vite & Tailwind. I set up my app as normal installing Vite, and Tailwind, and got everything running fine by testing for Tailwind css on localhost:5500.
Problem:
Once I added an Express server to the mix, and it sends the index.html in response to a 'GET' request @ '/', I no longer get the compiled CSS from tailwind.
Is this an uncommon setup that should be troublesome?

CodePudding user response：

You could possibly use a middleware like express.static

Example:

const express = require('express')
const app = express()

app.use(express.static(__dirname   '/public'))

app.get('/', (req, res) => {
    res.sendFile(__dirname   '/index.html')
})

In this example, the express.static middleware is used to serve the public directory, which is where the compiled CSS files from Tailwind will be located. Then the express server will send the index.html file in response to a GET request at the root '/' path.

Extra: Alternatively you can also use Webpack or Parcel , which can automatically handle the process of bundling and serving your CSS files