diff --git a/.dockerignore b/.dockerignore
new file mode 100644
index 00000000..7c3cca5c
--- /dev/null
+++ b/.dockerignore
@@ -0,0 +1,9 @@
+# path: ./.dockerignore
+
+.DS_Store
+node_modules
+dist
+.npmrc
+yarn.lock
+pnpm-lock.yaml
+package-lock.json
\ No newline at end of file
diff --git a/.env b/.env
index d6694761..a852014a 100644
--- a/.env
+++ b/.env
@@ -1,3 +1,4 @@
 APP_TITLE=快图设计-开源在线设计工具-vue-fabric-editor
+APP_BASE_PATH=/vue-fabric-editor/
 APP_APIHOST=https://www.kuaitu.cc
 APP_ADMINAPIHOST=https://www.kuaitu.cc/admin
\ No newline at end of file
diff --git a/Dockerfile b/Dockerfile
new file mode 100644
index 00000000..a72161a1
--- /dev/null
+++ b/Dockerfile
@@ -0,0 +1,13 @@
+FROM node:18-alpine3.18 as build
+
+WORKDIR /app
+COPY . .
+
+RUN npm install -g pnpm --registry=https://registry.npmmirror.com
+RUN pnpm install
+
+RUN ["pnpm", "build"]
+
+FROM nginx:stable-alpine
+COPY --from=0 /app/dist /usr/share/nginx/html/
+COPY nginx.conf /etc/nginx/conf.d/
diff --git a/docker-compose.yml b/docker-compose.yml
new file mode 100644
index 00000000..c5a8adaf
--- /dev/null
+++ b/docker-compose.yml
@@ -0,0 +1,7 @@
+version: '3'
+services:
+  kuaitu:
+    container_name: kuaitu
+    build: ./
+    ports:
+      - '8888:80'
diff --git a/nginx.conf b/nginx.conf
new file mode 100644
index 00000000..9cb67bdb
--- /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;
+  }
+}
diff --git a/vite.config.ts b/vite.config.ts
index 7339ad5d..8176d260 100644
--- a/vite.config.ts
+++ b/vite.config.ts
@@ -4,7 +4,7 @@
  * @Author: June
  * @Date: 2023-04-24 00:25:39
  * @LastEditors: 秦少卫
- * @LastEditTime: 2024-06-07 11:45:43
+ * @LastEditTime: 2024-06-11 10:55:13
  */
 import { defineConfig, loadEnv } from 'vite';
 import vue from '@vitejs/plugin-vue';
@@ -19,9 +19,10 @@ import autoprefixer from 'autoprefixer';
 const config = ({ mode }) => {
   const isProd = mode === 'production';
   const envPrefix = 'APP_';
-  const { APP_TITLE = '' } = loadEnv(mode, process.cwd(), envPrefix);
+  const { APP_TITLE = '', APP_PATH } = loadEnv(mode, process.cwd(), envPrefix);
+  console.log(APP_PATH, 111);
   return {
-    base: isProd ? '/vue-fabric-editor/' : '/',
+    base: isProd ? APP_PATH : '/',
     plugins: [
       vue(),
       autoImports({