VueJS Режим истории маршрутизатора за Nginx

Question

Моя проблема

Я прочитал официальную документацию о переводе маршрутизатора VueJS в режим истории за Nginx, а также следующее:

Stackoverflow- vue-router, nginx и прямая ссылка

Stackoverflow - Как настроить nginx для Vue-router на Docker

После просмотра всех этих изменений и внесения измененийнесколько раз я все еще не могу предоставить прямую ссылку на мои маршруты и заставить их загружаться правильно (иначе, я получаю 404 за все, кроме /).

Мое окружение

Я создаю образ докера nginx (nginx:alpine) и предоставляю ему статические файлы VueJS.

Моя конфигурация

Dockerfile

# build stage
FROM node:lts-alpine as build-stage
WORKDIR /app
COPY . .
RUN npm install && npm run build

# production stage
FROM nginx:stable-alpine as production-stage
COPY --from=build-stage /app/dist /usr/share/nginx/html
COPY prod_nginx.conf /etc/nginx/nginx.confg
EXPOSE 80
CMD ["nginx", "-g", "daemon off;"]

Конфигурация Nginx

Nginx Версия: 1.16.1

user                    nginx;
worker_processes        1;
error_log               /var/log/nginx/error.log warn;
pid                     /var/run/nginx.pid;
events {
    worker_connections  1024;
}

http {
    include             /etc/nginx/mime.types;
    default_type        application/octet-stream;
    log_format          main '$remote_addr - $remote_user [$time_local] "$request" '
                             '$status $body_bytes_sent "$http_referer"'
                             '"$http_user_agent" "$http_x_forwarded_for"';
    access_log          /var/log/nginx/access.log main;
    sendfile            on;
    keepalive_timeout   65;
    server {
        listen          80;
        server_name     _ default_server;
        index           index.html;
        location / {
            root        /usr/share/nginx/html;
            index       index.html;
            try_files   $uri $uri/ /index.html;
        }
    }
}