我基于https://github.com/docker/awesome-compose/tree/master/react-nginx的一个简单的React应用程序，但我做了一些修改，现在网站目前正在工作，除了React徽标没有旋转，当我检查网站时，我看到“您需要启用JavaScript才能运行此应用程序”。文件https://github.com/docker/awesome-compose/blob/master/react-nginx/public/index.html负责此标记。我的配置和https://github.com/docker/awesome-compose/tree/master/react-nginx之间的主要区别是我使用了非特权的nginx镜像。
此外，当我进入容器并执行ls -la /usr/share/nginx/html时，我会看到下面的输出：

drwxr-xr-x 1 root root 4096 Jul 26 18:29 .
drwxr-xr-x 1 root root 4096 Jul 24 00:08 ..
-rw-r--r-- 1 root root  605 Jul 26 18:29 asset-manifest.json
-rw-r--r-- 1 root root 3870 Jul 26 18:29 favicon.ico
-rw-r--r-- 1 root root  644 Jul 26 18:29 index.html
-rw-r--r-- 1 root root 5347 Jul 26 18:29 logo192.png
-rw-r--r-- 1 root root 9664 Jul 26 18:29 logo512.png
-rw-r--r-- 1 root root  492 Jul 26 18:29 manifest.json
-rw-r--r-- 1 root root   67 Jul 26 18:29 robots.txt
drwxr-xr-x 5 root root 4096 Jul 26 18:29 static

字符串
nginx.conf:

pid /tmp/nginx.pid;

events {}

http {
    include /etc/nginx/mime.types;
    server {
        listen 8080 ssl;
        ssl_certificate /etc/nginx/tls/tls.crt;
        ssl_certificate_key /etc/nginx/tls/tls.key;

        location / {
            root /usr/share/nginx/html;
            index index.html index.htm;
            try_files $uri /index.html =404;
        }

        error_page   500 502 503 504  /50x.html;

        location = /50x.html {
          root   /usr/share/nginx/html;
        }
    }
}

型
Dockerfile：

# syntax=docker/dockerfile:1.4

# 1. For build React app
FROM node:20.2.0-bullseye-slim AS development

# Set working directory
WORKDIR /app

# Copy package.json and package-lock.json to container
COPY package.json /app/package.json
COPY package-lock.json /app/package-lock.json

# Same as npm install
RUN npm ci && npm cache clean --force

COPY . /app

ENV CI=true
ENV PORT=3000

CMD [ "npm", "start" ]

FROM development AS build

RUN npm run build

FROM development as dev-envs

ENV PATH /app/node_modules/.bin:$PATH
ENV NODE_ENV=development

RUN apt-get update && apt-get install -y --no-install-recommends git

RUN useradd -s /bin/bash -m vscode && \
groupadd docker && \
usermod -aG docker vscode

# Install Docker tools (cli, buildx, compose)
COPY --from=gloursdocker/docker / /

RUN npm install && npm cache clean --force
RUN npm install -g nodemon

CMD [ "nodemon", "--inspect=0.0.0.0:9229"]

## Nginx unprivileged debian image
FROM nginxinc/nginx-unprivileged:1.25

## Switch to root user for setup
USER root

## Update apk and add curl
RUN apt-get update; \
    apt-get install -y curl; \
    apt-get install -y npm;

# Copy config nginx
COPY --from=build /app/.nginx/nginx.conf /etc/nginx/nginx.conf

# Copy mime.types from nginx image
COPY --from=nginx:alpine /etc/nginx/mime.types /etc/nginx/mime.types

WORKDIR /usr/share/nginx/html

# Remove default nginx static assets
RUN rm -rf ./*

# Copy static assets from builder stage
COPY --from=build /app/build .

# Copy the /app dir from builder stage in order to be able to do the unit tests
COPY --from=build /app /test-app

## Expose port 8080
EXPOSE 8080

## Switch to non-root user
USER nginx

## Healthchecks
# TODO Later, when you move from the self-signed certificates delete "-k" flag
HEALTHCHECK --interval=30s --timeout=5s --start-period=5s --retries=3 \
    CMD curl -k -f https://localhost:8080 || exit 1

型
Web源代码与https://github.com/docker/awesome-compose/tree/master/react-nginx中的相同。