Tailwind在Monorepo中不生成样式，90%是content路径未覆盖跨包源码；必须用path.resolve(__dirname, '..')写绝对路径、显式列出所有包路径及文件后缀，配置须为CommonJS格式module.exports。
Tailwind 在 Monorepo 里不生成样式？90% 是 content 路径没扫到跨包组件，不是配置写错了，是根本没读进去。
tailwind.config.js 的 content 必须显式覆盖所有包的源码路径
Monorepo 中 UI 组件（如 packages/ui）和业务页面（如 apps/web）物理隔离，content 默认只扫描当前包目录，./src/**/*.{ts,tsx} 这种写法会静默漏掉所有跨包类名。
- 正确写法示例：
content: ["../apps/**/src/**/*.{ts,tsx,jsx,mdx}", "../packages/**/src/**/*.{ts,tsx,jsx,mdx}"] - 路径层级必须与
pnpm-workspace.yaml实际结构严格对齐；多一个..或少一个，Tailwind 就不报错也不提示，只输出空 CSS - 务必排除构建产物目录，例如在 glob 后加
!../**/{dist,.next,node_modules}/**，否则可能触发重复扫描或性能抖动
共享 Tailwind 配置必须用 CommonJS + require()，不能用 ESM
Tailwind CLI 启动时同步加载配置，只认 module.exports。哪怕你用 tailwind.config.ts，也必须确保最终被 require() 加载的是 CommonJS 格式。
- 禁止写
export default config—— 会直接报Cannot use import statement outside a module - 最稳妥做法：用
tailwind.config.js，内容纯 JS，避开 TS 编译时机干扰 - 若坚持用 .ts，需确认该文件已被
ts-node或构建流程提前转成 .js，且导出是module.exports = config - 业务包中必须通过
require("tailwind-config")引入，不能用import—— Tailwind 不支持 ESM 配置入口
pnpm workspace 协议不是“可选”，而是缓存和增量构建的前提
用 npm link 或手动拷贝配置文件，会导致 Turborepo 缓存失效、CI 构建不一致、修改配置后本地不更新 —— 因为工具链根本不知道这个配置是“被依赖的”。
PigX UI Pro 前端开发指南 - Vue 3 + TypeScript + Element Plus。当用户提到 PigX UI、PigX 前端、lgb-mgui 项目、Vue 3 企业级后台开发、Element Plus 后台开发时使用此技能。
立即学习“前端免费学习笔记（深入）”；
- 必须在业务包中执行：
pnpm add -D workspace:tailwind-config - 检查
package.json是否出现："tailwind-config": "workspace:^0.0.0" - Turborepo 用户需在
turbo.json中声明："pipeline.build.dependsOn": ["^build"]或显式包含该配置包，否则缓存跳过变更
CSS 文件本身要按 JS 依赖方式引入，而非 HTML <link>
在多页面项目中，把 shared.css 放进每个页面的 HTML <head> 里看似简单，但构建工具无法分析依赖关系，导致样式无法复用、无法 code-splitting、甚至重复注入。
- 正确做法：在每个页面对应的 JS 入口（如
login.tsx、admin.tsx）顶部import "@/styles/shared.css" - Vite 的
build.rollupOptions.input若列出多个 HTML，则每个对应 JS 入口都必须自己import样式，否则不会被打进 chunk - 绝对避免：同一个 CSS 既被 JS
import，又被 HTML<link>引入 —— DevTools Network 面板会显示两次请求
最容易被忽略的是：Tailwind 扫不到跨包类名时，它不会报错，也不会警告，只会默默输出一个几 KB 的空 CSS 文件。上线后才发现按钮没样式、响应式断点全失效 —— 此时第一反应不该是查插件或升级版本，而是打开终端，运行 npx tailwindcss -c ./tailwind.config.js --dry-run，看它实际扫描到了哪些文件。
