nginx - 使用 nginx 加载静态文件时 TTFB 为 6+ 秒

Question

我使用 Vue-cli 作为前端并使用 webpack 构建静态文件。

nginx配置是：

server {
   listen       80;
    server_name  127.0.0.1;
    location / {
        root   /var/www/project/dist;
        index  index.html index.htm;
        try_files $uri $uri/ /index.html;
    }
    location ^~/api/ { proxy_pass http://127.0.0.1:5438/api/; }
 }

dist 文件是

    dist/
    ├── [1.1K]  favicon.ico
    ├── [ 901]  index.html
    └── [441K]  static
       ├── [229K]  css
       │   ├── [189K]  app.0134d2dda560ad06a1485c5f69858798.css
       │   └── [ 36K]  app.0134d2dda560ad06a1485c5f69858798.css.gz
       ├── [ 15K]  fonts
       │   └── [ 11K]  element-icons.6f0a763.ttf
       └── [193K]  js
           ├── [ 53K]  app.ce2c95e6433bd8164fc4.js
           ├── [ 18K]  app.ce2c95e6433bd8164fc4.js.gz
           ├── [ 799]  manifest.2ae2e69a05c33dfc65f8.js
           ├── [ 88K]  vendor.78ce98b3a34633bdf003.js
           └── [ 29K]  vendor.78ce98b3a34633bdf003.js.gz

当我访问它时，manifest.js 的 TTFB 超过 6 秒，因此加载第一个屏幕很慢。如何改善它？

标签： nginxvue.jswebpack