datart前端单独部署到nginx

这里假设你的本地可以正常跑起来前端项目，服务器为centos7且已经部署了nginx

构建前端工程(frontend文件夹下是前端工程)

npm run build:all

将构建出来的build文件夹放到服务器一个路径下

配置nginx.conf，这里只写了http节点下的server节点怎么配置

server {
    listen 3000;
    server_name localhost;

    # 静态文件目录
    root /xxxx/xxx/build/;  # 修改为你的项目打包输出路径,步骤2的那个路径

    # 默认访问的文件
    index index.html;

    # 配置 API 请求的代理
    location /api/v1/ {
        proxy_pass http://127.0.0.1:8080;  # 修改为你的后端 API 地址
    }

    # 配置静态资源代理
    location /resources/ {
        proxy_pass http://127.0.0.1:8080;  # 修改为后端资源路径
    }

    # 处理前端路由问题，重定向所有请求到 index.html
    location / {
        try_files $uri $uri/ /index.html;
    }

    # 处理特定页面的路由
    location /shareChart/ {
        try_files $uri /shareChart.html;
    }

    location /shareDashboard/ {
        try_files $uri /shareDashboard.html;
    }

    location /shareStoryPlayer/ {
        try_files $uri /shareStoryPlayer.html;
    }

    # 开启 gzip 压缩
    gzip on;
    gzip_types text/plain application/javascript application/x-javascript text/css application/xml text/javascript application/json;
    gzip_min_length 1000;
}

 

重启nginx

nginx -s reload