静态网站部署方案

isyangli_blog2026-05-16 20:56

[方案一：Nginx 静态部署（推荐）](#方案一：Nginx 静态部署（推荐）)

[1. 本地构建](#1. 本地构建)

[2. 上传到服务器](#2. 上传到服务器)

[3. 安装并配置 Nginx](#3. 安装并配置 Nginx)

[4. 配置内容](#4. 配置内容)

[5. 启用配置](#5. 启用配置)

方案一：Nginx 静态部署（推荐）

1. 本地构建

bash 复制代码

npm install
npm run build

构建完成后会生成 dist 目录

2. 上传到服务器

scp -r dist/* user@your-server-ip:/var/www/mineral-recognition/

3. 安装并配置 Nginx

bash 复制代码

sudo yum update
sudo yum install -y nginx --disableexcludes=all

sudo vi /etc/nginx/sites-available/mineral-recognition

4. 配置内容

bash 复制代码

server {
    listen 80;
    server_name your-domain-or-ip;
    
    root /var/www/mineral-recognition;
    index index.html;
    
    location / {
        try_files $uri $uri/ /index.html;
    }
}

TypeScript 复制代码

[root@VM-0-10-opencloudos ~]# sudo mkdir -p /etc/nginx/sites-available
[root@VM-0-10-opencloudos ~]# sudo mkdir -p /etc/nginx/sites-enabled
[root@VM-0-10-opencloudos sites-available]# vim /etc/nginx/sites-available/mineral-recognition
[root@VM-0-10-opencloudos sites-available]# cat /etc/nginx/sites-available/mineral-recognition
server {
            listen 80;
                server_name 81.70.236.134;

                    root /var/www/mineral-recognition;
                        index index.html;

                            location / {
                                            try_files $uri $uri/ /index.html;
                                                }
}
[root@VM-0-10-opencloudos sites-available]#

5. 启用配置

bash 复制代码

sudo ln -s /etc/nginx/sites-available/mineral-recognition /etc/nginx/sites-enabled/
sudo nginx -t
sudo systemctl restart nginx