使用 Docker 在 nginx 中部署时，角度未找到资源答案

【问题标题】：angular not finding resources when deployed inside nginx using Docker使用 Docker 在 nginx 中部署时，角度未找到资源
【发布时间】：2019-03-05 06:03:29
【问题描述】：

我正在尝试使用 Docker 和 Nginx 来部署我的 Angular 应用程序，但是，我遇到了一个问题。

当我运行命令：npm run build 时，我的 index.html 有以下脚本引用：

<body>
  <script type="text/javascript" src="runtime.js"></script>
  <script type="text/javascript" src="polyfills.js"></script>
  <script type="text/javascript" src="styles.js"></script>
  <script type="text/javascript" src="vendor.js"></script>
  <script type="text/javascript" src="main.js"></script>
</body>

根据我的感觉，这些是相对路径，因此当 nginx 启动时，我的 index.html 在 firstApp 中，然后在访问这些文件时，资源 URL 应创建为：

http://localhost/firstApp/runtime.js

但是当我在浏览器中运行应用程序时，我收到 404 错误，因为 Nginx 正在尝试在以下位置查找资源：

http://localhost/runtime.js

有没有办法解决这个问题？

【问题讨论】：

标签： angular docker nginx

【解决方案1】：

我遇到了同样的问题，但使用的是 jsons。 Complete solution 如何在 docker 上部署 Angular。但是我仍然有服务 json 的问题。我像这样编辑 docker 映像和 nginx 配置：

Docker：

# Stage 2
FROM nginx:1.15.8-alpine

COPY --from=node /usr/src/app/dist /usr/share/nginx/html

RUN rm /etc/nginx/nginx.conf /etc/nginx/mime.types
COPY nginx.conf /etc/nginx/nginx.conf
COPY mime.types /etc/nginx/mime.types

Nginx：

http {
    server {
        listen 80;
        server_name  localhost;

        root   /usr/share/nginx/html;
        index  index.html index.htm;
        include /etc/nginx/mime.types;

        gzip on;
        gzip_min_length 1000;
        gzip_proxied expired no-cache no-store private auth;
        gzip_types text/plain text/css application/json application/javascript application/x-javascript text/xml application/xml application/xml+rss text/javascript;

        location / {
            try_files $uri $uri/ /index.html;
             autoindex  on;
        }
         location ~* \.(json)$ {
        }
    }
}

Mime

我不是 nginx 的高手，所以也许有更好的解决方案。

【讨论】：