sveltekit 项目默认集成 postcss，无需手动配置；仅当需使用特定插件、迁移旧项目或自动配置失败时才需添加 postcss.config.js，且必须为 esm 格式并正确声明插件。
不用手动配 PostCSS，SvelteKit 项目默认已集成，强行加反而容易破坏热更新和构建流程。
确认你是否真需要 touch PostCSS 配置
绝大多数 SvelteKit 项目（尤其是 npm create svelte@latest 创建的）已内置 PostCSS 支持，postcss.config.js 并非必需。只有当你遇到以下情况时，才需显式干预：
- 项目里已有
postcss.config.js，且不能删（比如团队规范或历史遗留） - 你明确用了
postcss-preset-env、cssnano等插件，且依赖它们的处理逻辑 - 你正在迁移旧 Webpack/Vite 项目，且 CSS 处理链路必须复用
-
npx svelte-add@latest tailwindcss执行失败或生成的样式在构建后丢失
如果必须配置 postcss.config.js：只用 ESM 格式 + 正确插件名
手写或修改 postcss.config.js 是高频出错点。它必须是标准 ESM 导出，且插件名不能带路径或配置对象：
- ✅ 正确写法：
export default { plugins: { 'tailwindcss': {}, 'autoprefixer': {} } } - ❌ 错误写法：
module.exports = { plugins: [require('tailwindcss')] }（ESM 项目下直接报错） - ❌ 错误写法：
'tailwindcss': { config: './tailwind.config.js' }（多余，插件自动读取默认路径） - ❌ 错误写法：
postcss.config.json或postcss.config.cjs（SvelteKit 只识别.js且为 ESM）
tailwind.config.js 的 content 字段必须精确覆盖所有类名来源
Tailwind 不会运行时解析 JS 变量或模板字符串，只扫描 content 列出的文件中硬编码的 class 或 className。漏掉任何一项，对应类就会被 purge 掉：
- 必须包含
./src/**/*.{html,js,svelte,ts}—— 注意是.html，不是.svelte单独列 - 若用了
+layout.svelte或+page.svelte中的内联 class，也要确保路径能匹配 - 若引入了第三方 Svelte 组件库（如 Flowbite Svelte），需显式添加其源码路径，例如：
join(require.resolve('flowbite-svelte'), '../**/*.{js,svelte,ts}') - 路径必须以
./开头，写成src/**/*会被 Vite 忽略
@tailwind 指令顺序错误会导致 utilities 不生效
在主 CSS 入口（通常是 src/app.css 或 src/app.postcss）中，三行 @tailwind 必须严格按顺序出现，且不能被注释或条件包裹：
- 第一行：
@tailwind base - 第二行：
@tailwind components - 第三行：
@tailwind utilities - 任何顺序调换、中间插入其他规则、或放在
@layer外部，都会导致 utility 类（如text-lg、flex）不生成
最常被忽略的是 content 路径与实际文件后缀不一致，以及 postcss.config.js 用了 CommonJS 写法却跑在 ESM 项目里——这两处一错，整个 Tailwind 就静默失效，连报错都没有。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
