Laravel 8环境下通过axios打开模态框时TailwindCSS样式失效求助

数据老陈

2026-9-26

问题成因

TailwindCSS 内置的 Purge 机制会在构建时静态扫描指定路径下的文件，仅保留扫描到的样式类，未命中的类会从最终生成的CSS文件中剔除。你遇到的问题由两个配置错误共同导致：

tailwind.config.js 中Purge的扫描路径配置范围不足，./resources/views/*.blade.php 仅能匹配resources/views根目录下的blade模板，如果你存放create.blade.php的目录是子目录，模板内的样式类不会被扫描识别。
你手动强制开启了Purge（enable:true），该配置会导致无论开发还是生产环境都会执行样式清理，进一步放大了路径配置错误的影响。

修复步骤

修正tailwind.config.js的Purge配置，修改后内容如下：

module.exports = {
  purge: {
    // 去掉手动enable配置，默认仅生产环境开启Purge，开发环境保留全量样式方便调试
    content: [
      // 双星号**匹配所有子目录下的blade文件
      './resources/views/**/*.blade.php',
      './resources/js/**/*.js'
    ],
  },
  // 其余原有配置保持不变
  darkMode: false,
  theme: {
    // 原有主题配置保留
    extend: {
      container: {
        center: true
      },
      colors: {
        transparent: 'transparent',
        current: 'currentColor',
        bluegray: {
          light: '#E2E8F0',
          DEFAULT: '#64748B',
          dark: '#334155',
        },
        gray: {
          darkest: '#1f2d3d',
          dark: '#3c4858',
          DEFAULT: '#c0ccda',
          light: '#e0e6ed',
          lightest: '#f9fafc',
        }
      },
      
    }
  },
  variants: {
    extend: {},
  },
  plugins: [],
}