如何配置Tailwind CSS内容扫描路径？-css教程-PHP中文网

必须用path.resolve(__dirname, ...)确保路径始终基于配置文件位置解析，避免monorepo中process.cwd()变动导致扫描失效；需显式列出各包路径、覆盖所有文件后缀，且不扫描node_modules。

如何配置tailwind css内容扫描路径？

content 字段配错，Tailwind 就只生成 base 样式，bg-blue-500、text-sm 全都不见——它不报错，也不提示，只是静默丢掉所有 utility 类。

为什么 `content` 路径必须用 `path.resolve`？

因为 Tailwind 始终以 process.cwd() 为基准解析路径，而你在 Monorepo 里执行 pnpm build 的位置可能是根目录、apps/web 或任意子包，相对路径如 "../packages/ui/src/**/*" 会指向错误位置。

__dirname 是唯一稳定锚点：它永远指向当前 tailwind.config.js 所在目录。所以必须写成：

const path = require('path');
module.exports = {
  content: [
    path.resolve(__dirname, '../packages/ui/src/**/*.{js,jsx,ts,tsx}'),
    path.resolve(__dirname, '../../apps/admin/src/**/*.{js,jsx,ts,tsx}'),
  ],
}

Windows 下反斜杠 \ 完全兼容，不用转义
每个子包应维护自己的 tailwind.config.js，避免多版本行为不一致
如果某包用的是 lib 目录而非 src，路径必须同步改成 lib/**/*.{js,jsx,ts,tsx}

`content` 通配符为什么不能嵌套写？

Tailwind 内置的 glob 解析器（基于 fast-glob）不支持 **/src/** 这类嵌套通配符。写 "./packages/**/src/**/*.{ts,tsx}" 在 v3/v4 中均不可靠——可能只匹配到 packages/foo/src，却漏掉 packages/bar/src。

必须显式列出每一条路径：

哪怕有 10 个包，也要逐条写 path.resolve(__dirname, '../packages/button/src/**/*.{js,ts,tsx}')
后缀要全覆盖：.vue、.svelte、.astro、.mdx 都得单独加上
不要把 node_modules 路径加进 content，除非你明确引用了第三方库的源码（如 shadcn-svelte）

Vue / Nuxt / Svelte 等框架的 `content` 怎么写？

框架模板文件类型不同，content 必须匹配真实扩展名，否则扫描失效：

使用HTML,CSS,JavaScript开发Android应用程序英文文字pdf版附源文件

如果你了解HTML，CSS和JavaScript，您已经拥有所需的工具开发Android应用程序。本动手本书展示了如何使用这些开源web标准设计和建造，可适应任何Android设备的应用程序 - 无需使用Java。您将学习如何创建一个在您选择的平台的Android友好的网络应用程序，然后转换与自由PhoneGap框架到一个原生的Android应用程序。了解为什么设备无关的移动应用是未来的潮流，并开始构建应用程序，提供更

下载

Vue 项目：至少包含 "./src/**/*.{vue,js,ts,jsx,tsx}"，漏掉 .ts 就扫不到 Composition API 里的动态 class
Nuxt 3：默认生成的 tailwind.config.ts 含 app.vue 和 pages/**/*.{vue,ts}，但若用了 composables/ 或 plugins/ 里拼接 class，就得手动加进去
SvelteKit：必须加 "./src/routes/**/*.{svelte,ts}" 和 "./src/lib/**/*.{svelte,ts}"，.svelte 后缀不能省