Nginx 不能自动合并 CSS 文件，需由 Webpack、Vite 等构建工具在打包阶段完成；可通过 keepalive、HTTP/2、缓存和压缩优化 CSS 加载性能。
在 Nginx 中，CSS 文件本身不能被自动合并请求——这是前端构建阶段的任务，Nginx 不具备解析 HTML 或 CSS、动态合并资源的能力。但你可以通过合理配置，让浏览器更高效地加载 CSS，并配合连接复用（keepalive）减少 TCP 和 TLS 开销，从而提升首屏渲染速度和整体资源加载效率。
静态 CSS 合并需由构建工具完成
Nginx 只负责按路径分发已存在的文件，它不会读取 HTML 中的 <link rel="stylesheet"> 标签，也不会把多个 CSS 拼成一个响应。真正的合并应在构建时完成：
- 使用 Webpack、Vite、Rollup 等工具，在打包阶段将多份 CSS 提取并合并为单个文件（如
app.css） - 配合
mini-css-extract-plugin（Webpack）或cssCodeSplit: false（Vite）控制拆分策略 - 确保 HTML 中只引用最终生成的单个 CSS URL，避免多个
<link>标签触发多次请求
启用 HTTP/1.1 keepalive 减少连接开销
现代浏览器默认对同一域名并行发起多个请求，若每次都要新建 TCP+TLS 连接，会显著拖慢 CSS（尤其是多个小文件）的加载。Nginx 默认已开启 keepalive，但需确认关键参数：
-
keepalive_timeout 65;：保持空闲连接 65 秒，足够覆盖多数页面资源加载周期 -
keepalive_requests 100;：单个连接最多处理 100 个请求，防止长连接被滥用 - 确保后端（如 PHP-FPM）也支持 keepalive，否则 upstream 连接可能提前关闭
利用 HTTP/2 进一步优化多 CSS 加载
如果你启用了 HTTPS，建议升级到 HTTP/2。它原生支持多路复用（multiplexing），即使 HTML 引用了多个 CSS 文件，也能在同一个 TCP 连接上并发传输，无需依赖合并或域名分片：
立即学习“前端免费学习笔记（深入）”；
- 在 Nginx 配置中启用 HTTP/2：
listen 443 ssl http2; - 确保 SSL 配置兼容（如使用 TLS 1.2+，禁用不安全加密套件）
- 注意：HTTP/2 不改变资源是否合并的必要性——合并仍有利于减少 HTTP 头开销与缓存粒度，但紧急程度降低
补充：缓存与压缩强化 CSS 加载体验
即便不合并，也可通过 Nginx 提升 CSS 的传输效率：
- 设置强缓存：
location ~ \.css$ { expires 1y; add_header Cache-Control "public, immutable"; } - 启用 gzip / brotli 压缩：
gzip on; gzip_types text/css;或brotli on; brotli_types text/css; - 使用
try_files避免 404 泄露路径细节，同时加快静态文件定位
