Tailwind配置文件必须用CommonJS导出,即module.exports = { ... },不可用export default或ES模块语法;content路径需显式覆盖所有子包源码目录,如pnpm workspace结构下应写"../packages//src//*.{ts,tsx}"等;跨包引用须用workspace:协议安装并require引入,避免npm link或复制配置。

tailwind.config.js 必须用 CommonJS 导出,不能用 export default
Tailwind CLI 启动时是同步加载配置文件的,只认 module.exports。哪怕你写的是 tailwind.config.ts,最终被 require() 加载的也必须是 CommonJS 格式。
常见错误:Cannot use import statement outside a module 就是因为用了 export default config 或 import 语法。
- 稳妥做法:直接用
tailwind.config.js,内容写成module.exports = { ... } - 若坚持用 TS,确保构建后生成的是
.js文件,且导出形式为module.exports = config,不是export default - 不要在配置里
import其他包的类型定义——TS 类型在运行时不存在,require阶段会报错
content 路径必须显式覆盖所有子包源码目录
Tailwind 不会自动跨包扫描,content 字段写错,它就静默不生成对应类——不报错、不警告、CSS 体积异常小,极难排查。
典型错误:"./src/**/*.{ts,tsx}" 只扫当前包,packages/ui 里的组件类名全丢。
Miller (mlr) 是一个命令行工具,用于查询、整形和重新格式化名称索引数据,如 CSV、TSV、JSON 和 JSON Lines。它将 awk、sed、cut、join 和 sort 的功能整合到一个专为结构化数据处理而构建的单一工具中。
立即学习“前端免费学习笔记(深入)”;
- 正确写法示例(pnpm workspace 结构):
"../apps/**/src/**/*.{ts,tsx,jsx,mdx}"和"../packages/**/src/**/*.{ts,tsx,jsx,mdx}" - 路径层级必须和
pnpm-workspace.yaml实际结构严格一致;多一个或少一个..,就扫不到 - 务必排除构建产物目录,比如加
"!../**/{dist,.next,node_modules}/**",否则可能触发重复解析或内存溢出
依赖引用必须用 workspace: 协议,不能 npm link 或复制配置
用 npm link 或手动拷贝 tailwind.config.js,会导致 Turborepo 缓存失效、CI 构建不一致、本地修改不生效。
验证是否正确:package.json 中应出现类似 "tailwind-config": "workspace:^0.0.0" 的字段。
- 安装命令必须是:
pnpm add -D workspace:tailwind-config - 配置文件中引入方式必须是:
const config = require("tailwind-config"),不是import - 若用 Turborepo,
turbo.json的pipeline.build.dependsOn必须包含该配置包,否则改了配置也不会触发重构建
UnoCSS / Windi CSS 同样卡在 content 或 include 路径上
UnoCSS 不是 Tailwind 的“平替”,它是独立的原子化引擎,扫描逻辑完全不共享。默认只扫当前工作目录,对 packages/ui 这类被引用但不在当前 apps/web 目录下的源码,根本不会触达。
- 必须显式扩展
content(UnoCSS)或include(Windi)列表,指向所有含 JSX/TSX 的包路径 - 某些插件(如
@unocss/webpack)需额外配transformers才能处理跨包导入的组件,否则 class 名提取失败 - 如果同时用 Tailwind 和 UnoCSS,注意它们的 class 提取互不干扰——没共用逻辑,得各自配全路径
content glob 是否还有效。

















