一、前端镜像制作

假设，你x86架构的前端镜像是dist:v1后续操作如下：

前提：你要有docker buildx工具 安装方法如下（ubuntu为例）：

sudo apt update
sudo apt install -y ca-certificates curl gnupg

# 导入 Docker 官方 GPG
curl -fsSL https://download.docker.com/linux/ubuntu/gpg | sudo gpg --dearmor -o /usr/share/keyrings/docker.gpg
sudo chmod a+r /usr/share/keyrings/docker.gpg

# 添加 Docker 源
echo "deb [arch=$(dpkg --print-architecture) signed-by=/usr/share/keyrings/docker.gpg] https://download.docker.com/linux/ubuntu $(lsb_release -cs) stable" | sudo tee /etc/apt/sources.list.d/docker.list > /dev/null

sudo apt update

# 直接装 buildx 插件
sudo apt install -y docker-buildx-plugin

打包：docker buildx build --platform linux/arm64 -t xxx:arm64 --load .

方案 1：应急快速制作（不用源码，直接基于现有镜像改造）

步骤 1：导出当前镜像的文件系统

# 1. 临时启动容器，导出所有文件
docker run -d --name temp-frontend dist:v1
docker export temp-frontend -o frontend-rootfs.tar
docker rm -f temp-frontend

步骤 2：写 arm64 重建用的 Dockerfile

假设：
Nginx 配置文件：./etc/nginx/conf.d/default.conf
静态页面文件：./usr/share/nginx/html/（里面的 index.html、各种页面都在这里）

# 阶段0：解压前端文件（用当前x86架构的busybox就行）
FROM --platform=$BUILDPLATFORM busybox:1.36 AS extract
WORKDIR /rootfs
ADD frontend-rootfs.tar .

# 阶段1：构建arm64的Nginx镜像
FROM --platform=linux/arm64 nginx:alpine

# 复制配置文件
COPY --from=extract /rootfs/etc/nginx/conf.d/default.conf /etc/nginx/conf.d/default.conf

# 复制静态页面文件
COPY --from=extract /rootfs/usr/share/nginx/html /usr/share/nginx/html

EXPOSE 80
CMD ["nginx", "-g", "daemon off;"]

步骤3：执行构建

修改完 Dockerfile 后，执行构建命令：

docker buildx build --platform linux/arm64 -t dist:arm64 . --load

执行过程遇到的问题：

这次报错的核心原因很明确：/usr/share/nginx/html: not found，也就是你导出的文件系统里，静态文件的路径和你在 Dockerfile 里写的路径对不上。

先把 frontend-rootfs.tar 解压，确认真实路径：

mkdir rootfs && cd rootfs
tar -xf ../frontend-rootfs.tar
ls -la
# 重点看：/etc/nginx/conf.d/ 里的配置文件，以及静态文件在哪里
find . -name "*.html" | head -10
find . -name "default.conf"