Vite8+Tailwindcss3 生产环境样式失效问题

场景

• Vite: 8.0.10
• Tailwindcss: 3.4.19
• 浏览器: Google Chrome 89

问题描述

• 样式在开发环境下正常，生产环境下样式 媒体查询 失效。

解决方案

• 在 vite.config.ts 文件中不压缩 CSS，即设置 build.cssMinify 为 false

  export default defineConfig({
    build: {
      cssMinify: false,
    },
  });

• 使用官方推荐的 PostCSS 插件 cssnano 来压缩 CSS，详情