intility/nginx-unprivileged-react

nginx-unprivileged-react

镜像概述

nginx-unprivileged-react是一个配置用于运行React应用（或其他单页应用）的Nginx Docker镜像。其核心用途是托管单页应用(SPA)并支持客户端路由，通过提供React应用的默认配置避免在每个React仓库中重复配置，同时以非特权模式运行确保OpenShift兼容性，并基于Alpine构建实现轻量级特性（最终镜像大小约10MB）。

核心功能与特性

• 客户端路由支持：内置配置支持SPA的客户端路由功能
• React应用默认配置：包含React应用的标准Nginx配置，无需在项目中重复定义
• 非特权运行：以非root用户权限运行，符合OpenShift等容器平台的安全要求
• 轻量级设计：基于Alpine Linux构建，最终镜像大小约10MB，资源占用低

使用场景与适用范围

适用于React或其他前端框架的单页应用开发者，需要通过Docker容器化方式托管应用的场景。特别适合需要在OpenShift等严格安全要求的容器平台部署SPA的开发团队。

核心技术

• Docker：容器化技术
• Nginx：轻量级Web服务器，用于托管静态资源和处理路由

获取与使用

镜像位置

Docker Hub：intility/nginx-unprivileged-react

使用方法

基本使用（单阶段构建）

将应用的构建输出复制到镜像的/usr/share/nginx/html目录：

Dockerfile
FROM docker.xuanyuan.run/intility/nginx-unprivileged-react

COPY build/ /usr/share/nginx/html

多阶段构建（推荐）

先在Node环境中构建应用，再将构建结果复制到nginx镜像：

Dockerfile
# 构建阶段
FROM node:12 AS build
WORKDIR /src

# 安装依赖
COPY package*.json .
RUN npm install

# 复制源代码并构建生产版本
COPY . .
RUN npm run build

# 部署阶段
FROM intility/nginx-unprivileged-react

# 从构建阶段复制构建结果到Nginx静态文件目录
COPY --from=build /src/build /usr/share/nginx/html