diff --git a/Dockerfile b/Dockerfile
index 3d81a58..c51f335 100644
--- a/Dockerfile
+++ b/Dockerfile
@@ -1,7 +1,29 @@
-# https://lipanski.com/posts/smallest-docker-image-static-website
-# https://github.com/lipanski/docker-static-website
-FROM wcjiang/docker-static-website:latest
+# 使用官方 Node.js 运行时作为父镜像
+FROM node:18-alpine AS build-stage
 
-# Copy the static website
-# Use the .dockerignore file to control what ends up inside the image!
-COPY ./dist .
\ No newline at end of file
+# 设置工作目录
+WORKDIR /app
+
+# 将应用的源代码复制到容器中
+COPY . .
+
+# 安装 Yarn
+RUN npm install -g yarn --force && yarn install --force && yarn build
+
+# 使用Nginx作为基础镜像
+FROM nginx:alpine as builder
+
+# 删除默认的 Nginx 网站
+RUN rm -rf /usr/share/nginx/html/*
+
+# 将本地Nginx配置文件复制到容器中
+COPY nginx.conf /etc/nginx/conf.d/default.conf
+
+# 将Vue.js应用的构建产物复制到Nginx的默认目录
+COPY --from=build-stage /app/dist /usr/share/nginx/html
+
+# 暴露Nginx端口
+EXPOSE 80
+
+# 启动Nginx
+CMD ["nginx", "-g", "daemon off;"]
\ No newline at end of file
diff --git a/nginx.conf b/nginx.conf
new file mode 100644
index 0000000..3473f7e
--- /dev/null
+++ b/nginx.conf
@@ -0,0 +1,15 @@
+server {
+    listen 80;
+    server_name localhost;
+
+    location / {
+        root /usr/share/nginx/html;
+        index index.html;
+        try_files $uri $uri/ /index.html;
+    }
+
+    error_page 500 502 503 504 /50x.html;
+    location = /50x.html {
+        root /usr/share/nginx/html;
+    }
+}
\ No newline at end of file