在React的tailwind.config中添加node_modules至content字段引发报错

报错内容翻译 #

错误：检测到内容源 "./node_modules/**/*.{js,jsx,ts,tsx}" 包含大量文件，这会大幅拖慢构建速度。若确实需要包含node_modules目录下的文件，请在tailwind.config.js中添加safelist配置指定需保留的样式，或缩小文件匹配范围。

解决方案 #

• 删掉content数组里的"./node_modules/**/*.{js,jsx,ts,tsx}"。Tailwind不需要默认扫描整个node_modules目录，除非你要用到某个第三方/本地库的Tailwind类，这时只需要精准匹配该库的路径，比如"./node_modules/your-local-lib/**/*.{js,jsx,ts,tsx}"。
• 如果必须保留部分node_modules文件，同时不想影响构建速度，手动配置safelist指定需要保留的样式类：

module.exports = {
  content: [
    "./src/**/*.{js,jsx,ts,tsx}",
    "./src/components/**/*.{js,jsx,ts,tsx}",
    "./node_modules/your-target-lib/**/*.{js,jsx,ts,tsx}"
  ],
  safelist: [
    'bg-blue-500',
    'text-white',
    // 按需添加其他需要保留的类
  ]
}

• 检查配置文件语法：原代码中content数组末尾多了逗号，修正后确保语法正确，示例：

// tailwind.config.js
module.exports = {
  content: [
    "./src/**/*.{js,jsx,ts,tsx}",
    "./src/components/**/*.{js,jsx,ts,tsx}"
  ],
  // 其他配置（theme、plugins等）
}

内容的提问来源于stack exchange，提问作者soon