nginx 不合并 css/js，资源合并必须在构建阶段完成；它仅负责高效分发已合并资源，并通过压缩、缓存、http/2 等优化传输性能。

Nginx 本身不参与 CSS、JS 等静态资源的依赖合并——它不会读取 HTML 中的 <link> 或 <script></script> 标签，也不会把多个 CSS 文件拼成一个响应。真正的资源合并必须在构建阶段完成，Nginx 的角色是高效分发这些已合并好的资源，并通过连接复用、压缩、缓存等手段减少加载延迟。

下面从实际可操作的角度说明关键环节：

Nginx Config Linter

对 Nginx 配置文件进行语法检查、验证和安全、性能审计。

下载

构建时合并资源（不可绕过的基础）

• 使用 Webpack、Vite 或 Rollup 等现代构建工具，在打包时将分散的 CSS 提取并合并为单个文件（如 app.css）
• Webpack 推荐配合 mini-css-extract-plugin；Vite 可设 build.cssCodeSplit: false 关闭 CSS 拆分
• 最终 HTML 中只保留一个 <link rel="stylesheet" href="/static/app.css">，避免多个请求触发串行阻塞

Nginx 配合构建结果做传输优化

• 启用 gzip 或更优的 brotli 压缩，针对 text/css 类型：

  gzip on;
  gzip_types text/css application/javascript;
  brotli on;
  brotli_types text/css application/javascript;

• 设置强缓存策略，让浏览器长期复用：

  location ~ \.css$ {
      expires 1y;
      add_header Cache-Control "public, immutable";
  }

• 开启 sendfile、tcp_nopush 和 tcp_nodelay，提升文件传输效率：

  sendfile on;
  tcp_nopush on;
  tcp_nodelay on;

连接层面减少开销（尤其对未合并场景兜底）

• 确保 keepalive 正常启用（Nginx 默认已开），推荐配置：

  keepalive_timeout 65;
  keepalive_requests 100;

• 若已部署 HTTPS，务必启用 HTTP/2：

  listen 443 ssl http2;

  它支持多路复用，即使 HTML 引用了多个 CSS，也能并发传输，缓解未合并带来的性能损失。

不复杂但容易忽略