已禁用Tailwind Preflight仍加载，导致Bootstrap按钮透明

• 排查第三方插件/依赖注入
  检查项目中是否引入了@tailwindcss/forms、@tailwindcss/typography这类官方插件，或是daisyUI等第三方UI库。这类工具可能会自动注入自身的Preflight样式：

  • 对于@tailwindcss/forms，可以在配置中设置strategy: 'class'来禁用全局样式注入：

    plugins: [
      require('@tailwindcss/forms')({
        strategy: 'class',
      }),
    ]
    

  • 其他第三方库可查阅文档，找到禁用自带全局样式的选项。

• 检查构建工具与PostCSS配置

  • 如果是Vite/Create React App（含craco）项目，确认对应配置文件（vite.config.js/craco.config.js）中Tailwind插件没有强制开启Preflight的额外设置。
  • 查看postcss.config.js，确保只引入一次tailwindcss插件，没有重复配置或冲突的PostCSS插件导致Preflight重复注入。

• 清理缓存与重建依赖
  执行以下命令清理依赖缓存并重新安装，避免旧缓存残留的样式：

  rm -rf node_modules package-lock.json yarn.lock
  npm install
  npm start # 或npm run build后再启动
  

  同时使用浏览器无痕模式打开页面，排除浏览器缓存的影响。

• 排查项目内动态样式注入代码
  全局搜索项目代码，查找是否有通过document.createElement('style')或类似方式动态注入Tailwind Preflight的自定义脚本/组件，这类代码不会出现在静态HTML中，只会在渲染后生成style标签。

• 确认Tailwind配置生效
  确保tailwind.config.js中的corePlugins.preflight: false配置正确，没有被其他配置覆盖：

  module.exports = {
    content: ["./src/**/*.{js,jsx,ts,tsx}"],
    corePlugins: {
      preflight: false, // 确认此配置存在且未被覆盖
    },
    theme: { extend: {} },
    plugins: [],
  }
  

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