Uso de vue3 tailwindcss

Primeiro instale as dependências:

npm install -D tailwindcss@latest postcss@latest autoprefixer@latest

npm i -D unocss

Em seguida, introduza em vite.config.ts

import Unocss from 'unocss/vite'

export default defineConfig({
    plugins: [
       
        Unocss(),
    ],
    
})

Terminal executa:

npx tailwindcss init -p

Dois arquivos serão gerados no diretório raiz do projeto

 tailwind.config.js

module.exports = {
    content: [
        "./index.html",
        "./src/**/*.{vue,js,ts,jsx,tsx}",
    ],
    theme: {
        extend: {},
    },
    plugins: [],
}

postcss.config.js

module.exports = {
    plugins: {
        tailwindcss: {},
        autoprefixer: {},
    },
}

Depois de concluir as etapas acima, você pode usar diretamente os nomes de classe relevantes fornecidos pelo tailwind nas tags.

VScode instala o plug-in  Tailwind CSS IntelliSense e haverá dicas de código