❮
EDA All-in-one

Appearance

项目部署

⏱️最后更新: 2025/07/27

下载本节配置文件

打包项目

运行命令

bash
npm run build

执行后将根目录下的 dist 目录进行压缩，如下所示 picture 2

准备部署文件

markdown
.
├── default.conf
├── dist
│   ├── 404.html
│   ├── annoucement.html
│   ├── assets
│   ├── contact.html
│   ├── copyright.html
│   ├── docfiles
│   ├── hashmap.json
│   ├── index.html
│   ├── sponsor.html
│   ├── sponsors
│   └── vp-icons.css
├── dist.zip
├── docker-compose.yml
└── dockerfile

default.conf

bash
server {
    listen       80;
    server_name  localhost;

    location / {
        root   /usr/share/nginx/html;
        index  index.html index.htm;
        try_files $uri $uri/ /index.html;
    }

    error_page   500 502 503 504  /50x.html;
    location = /50x.html {
        root   /usr/share/nginx/html;
    }
}

dockerfile

FROM nginx:1.9.0
COPY dist/ /usr/share/nginx/html/
COPY default.conf /etc/nginx/conf.d/default.conf

docker-compose.yml

yml
version: "3.8"

services:
  vueapp:
    build:
      context: .
      dockerfile: Dockerfile
    ports:
      - "80:80"

部署

将文件上传至服务器指定目录下

bash
# 1. 解压dist
sudo unzip -o dist.zip -d /dist
# 2. 格式化文件
sudo dos2unix Dockerfile
sudo dos2unix docker-compose.yml
# 3. 启动项目
sudo docker-compose up -d

或者创建一个 sh 文件，批量运行命令

bash
cd /home/web && \
sudo docker-compose -f docker-compose.yml down && \
sudo docker rmi web-vueapp && \
sudo rm -rf dist dist.zip && \
sudo rz && \
sudo unzip -o dist.zip -d dist/ && \
sudo docker-compose -f docker-compose.yml up -d

验证服务状态

浏览器访问 http://ip地址 应看到跟本地开发一样的效果 picture 0