安装依赖
pnpm install tailwindcss @tailwindcss/vite
配置插件
import { defineConfig } from 'vite'
import tailwindcss from '@tailwindcss/vite' // 关键
export default defineConfig({
plugins: [
tailwindcss(), // 关键
],
})
全局css文件引入
@import "tailwindcss";
使用
<h1 class="text-3xl font-bold underline">Hello world!</h1>
说明已经生效了。
vscode插件
Tailwind CSS IntelliSense
使用这个插件可以提示帮助开发效率。