Laravel Tailwind Purge 无法识别PHP文件内CSS类 求解决方案

1. 修正配置字段并扩大扫描范围 #

如果使用的是Tailwind CSS v3及以上版本，原purge配置字段已废弃，需替换为content，同时建议直接匹配整个表单目录下的所有PHP文件，避免后续新增表单文件时重复修改配置：

// tailwind.config.js
module.exports = {
  mode: "jit",
  content: [
    "./resources/**/*.blade.php",
    "./resources/**/*.js",
    "./resources/**/*.vue",
    "./app/Forms/**/*.php", // 匹配Forms目录下所有PHP文件
  ],
}

如果仍使用Tailwind CSS v2，保留purge字段即可，只需修改路径匹配规则。

2. 新增安全列表强制保留类 #

如果用到的类名数量少且固定，可以直接将需要保留的类添加到safelist配置中，优先级高于扫描规则，不会被移除：

// tailwind.config.js
module.exports = {
  mode: "jit",
  content: [/* 原有路径保持不变 */],
  safelist: [
    'ml-2', 'block', 'text-sm', 'text-gray-900', 'capitalize',
    'h-4', 'w-4', 'text-indigo-600', 'focus:ring-indigo-500', 'border-gray-300', 'rounded'
  ]
}

3. 自定义PHP文件提取规则 #

如果默认的类名提取器无法识别PHP数组中字符串格式的类名，可以新增针对PHP文件的自定义提取规则：

// tailwind.config.js
module.exports = {
  mode: "jit",
  content: [/* 原有路径保持不变 */],
  extractors: [
    {
      extensions: ['php'],
      extractor: (content) => {
        // 匹配PHP文件中所有符合类名规则的字符串
        return content.match(/[^<>"'`\s]*[^<>"'`\s:]/g) || []
      }
    }
  ]
}

补充说明：开发环境下Tailwind默认不会触发类移除逻辑，建议修改配置后用生产环境编译命令（如npm run build）验证效果。

内容的提问来源于stack exchange，提问作者Matt The Ninja