TailwindCSS
vue2 (tailwindcss:v2)
好像是
vue2不支持postcss:8的缘故，导致了不能使用tailwindcss:v3。tailwindcss:v2 相比 tailwindcss:v3 缺少了自定义单位。如：
mt-[200px]
安装依赖
npm install -D tailwindcss@npm:@tailwindcss/postcss7-compat postcss@^7 autoprefixer@^9
创建文件 tailwindcss.css
@import "tailwindcss/base";
@import "tailwindcss/components";
@import "tailwindcss/utilities";
引入到 main.js 中
import "./assets/tailwindcss.css"
初始化
npx tailwindcss init -p
# 此时项目根目录会多出两个文件
# - postcss.config.js
# - tailwind.config.js
最后试试效果，有背景色就代表成功了
<p class="bg-blue-500">111111</p>
建议安装 vscode 提示插件
参考文章