请教下前端 docker 部署问题

部署简单的架构

用户请求域名->服务器 nginx->前端 docker 服务

前端 docker 配置如下

1. docekrfile

FROM node:lts-alpine AS builder # install simple http server for serving static content RUN npm install -g http-server # make the 'app' folder the current working directory WORKDIR /app # copy both 'package.json' and 'package-lock.json' (if available) COPY package*.json ./ # install project dependencies RUN npm install # copy project files and folders to the current working directory (i.e. 'app' folder) COPY . . # build app for production with minification RUN npm run build # build the nginx image FROM nginx:1.17 COPY --from=builder /app/dist /usr/share/nginx/html COPY ./nginx.conf /etc/nginx/conf.d/ EOF 

2.docker nginx 配置 nginx.conf

server { listen 80; server_name localhost; root /usr/share/nginx/html; index index.html; location ~* ^.+\.(jpg|jpeg|gif|png|ico|css|js|pdf|txt){ root /usr/share/nginx/html; } location / { try_files $uri $uri/ @router; index index.html; } location @router { rewrite ^.*$ /index.html last; } } 

服务器的 nginx 配置

现在是这样的配置

 location /api/ { rewrite ^.+api/?(.*)$ /$1 break; # 去除本地接口 /api 前缀, 否则会出现 404 proxy_pass http://xxx.xxxx:8081; # 前端代理的后端服务接口 proxy_set_header X-Real-IP $remote_addr; proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for; proxy_set_header X-Forwarded-Server $host; #add_header 'Access-Control-Allow-Origin' '*'; #add_header 'Access-Control-Allow-Credentials' 'true'; } location / { proxy_pass http://127.0.0.1:8080; #前端 docker 访问的路径 # try_files $uri $uri/ /index.html; } 

上面这种配置后，访问刷新路由会 404 ，如果加上 try_files $uri $uri/ /index.html; 就会报错

iled to load module script: Expected a Javascript module script but the server responded with a MIME type of "text/html". Strict MIME type checking is enforced for module scripts per HTML spec. 

注：两边 nginx 都有配置

include /etc/nginx/mime.types; default_type application/octet-stream; 

求大佬解答