pnpm i -D autoprefixer postcss prettier-plugin-tailwindcss tailwindcss
tailwind.config.js的content：
/** @type {import('tailwindcss').Config} */
export default {
content: ['./index.html', './src/**/*.{vue,js,ts,jsx,tsx}'],
theme: {
extend: {},
},
plugins: [],
};
vite.config.js：
import tailwindcss from 'tailwindcss'
import autoprefixer from 'autoprefixer'
...
export default defineConfig({
...,
css: {
postcss: {
plugins: [tailwindcss, autoprefixer(), ...]
}
}
})
@/assets/styles/tailwindcss.css：
@tailwind base;
@tailwind components;
@tailwind utilities;
main.js：
import '@/assets/styles/tailwindcss.css';
.prettierrc：
{
"singleQuote": true,
"printWidth": 135,
"plugins": [
"prettier-plugin-tailwindcss"
]
}
