vue.js - 如何使用 nginx 配置 Vue.js 和简单的 html 应用程序？

Question

我有一个 Vue.js 应用程序和一个使用 nginx 托管的 REST api。在 /root url 处只有一个简单的 index.html 页面。/api/ 有一个 REST 服务器和 /app 有 vue.js 应用程序

我的配置是..

server {

       listen 80;
       listen 443 ssl;
       server_name _;
       root /usr/share/backend;
       ssl_certificate /etc/nginx/ssl/server.crt;
       ssl_certificate_key /etc/nginx/ssl/server.key;
       location / {
           index index.html;
       }
       location /api/ {
                proxy_set_header X-Forwarded-For $remote_addr;
                proxy_set_header Host            $http_host;
                proxy_pass http://localhost:8080/;
        }
       location /app {
                alias /usr/lib/App/;
                try_files /index.html /friendly_404;
        }

       location /friendly_404 {
                return 404 "Sorry, that file could not be found.";
       }

       error_log  /var/log/nginx/vue-app-error.log;
       access_log /var/log/nginx/vue-app-access.log;

}

我的 /api/ 服务器可以正常工作，但是 vue.js /app 无法正常工作，并且在我的浏览器上它给了我一些类似下面这样的多个错误。

GET http://192.168.0.1/js/chunk-d9925106.16c4e8be.js net::ERR_ABORTED 404（未找到）

Vue.js 配置是..

module.exports = {
  // ...other vue-cli plugin options...
  publicPath: '/app/',
  configureWebpack: {
    plugins: [
    ]
  },

  productionSourceMap: false,
}

我在这里做错了什么？

标签： vue.jsnginxserver