目錄

vue-app
├── docker-data
│ ├── site
│ ├── app
├── docker-compose.yaml
└── deploy.sh

docker-compose.yaml

yaml文件執行

version: '3.8'services:node:image: node:latestcontainer_name: vue-appports:- "8080:8080" # 宿主8080映射容器8080volumes:- ./docker-data/site/app:/app  # 宿主路徑容器工作路徑working_dir: /app #執行下面command命令時工作目錄restart: alwayscommand: bash -c  "npm install &&  npm run dev"  # 啟動容器執行命令

deploy.sh

#!/bin/bash
set -e
docker compose pull
docker compose up -d --remove-orphans

vue-app/docker-data/site/app下放vite創建的vue項目

修改vite.config.ts

import { defineConfig } from 'vite'
import vue from '@vitejs/plugin-vue'// https://vitejs.dev/config/
export default defineConfig({plugins: [vue()],server: {port: 8080, //指定端口host: '0.0.0.0', //一定要寫這個，不然宿主機 8080端口會打不開站點},
})

打開終端，進去vue-app目錄

cd /Volumes/disk/site/docker/vue-app

輸入命令，啟動容器

./deploy.sh 
或者輸入命令 
docker compose up -d

瀏覽器打開localhost:8080