next + koa + vue项目部署

闻飞跃
2023-12-01

开始项目的时候nuxt.js 的vue3版本还是beta不稳定,所以选用的next.js

一、 安装node

去node官网下载对应的linux版本,上传到/usr/local目录
解压文件 tar -xvf node-v14.17.0-linux-x64.tar.xz,
建立软连接
node:ln -s /usr/local/node-v14.17.0-linux-x64/bin/node /usr/local/bin
npm:ln -s /usr/local/node-v14.17.0-linux-x64/bin/npm /usr/local/bin
检查是否安装成功:node -v
设置npm镜像npm config set registry https://registry.npm.taobao.org

二、PM2

安装pm2 :npm install pm2 -g
给PM2建立软链接:ln -s /usr/local/node-v14.17.0-linux-x64/bin/pm2 /usr/local/bin
检查是否成功:pm2 list
PM2 基本命令:
开启任务
pm2 start 项目名
停止任务
pm2 stop 项目名
新建任务
pm2 start npm --name official(项目名) --namespace /home/opt/app/official(项目路径) -- run dev
删除任务
pm2 delete 项目名
删除全部任务
pm2 delete all
查看任务列表:
pm2 list
保存列表
pm2 save

三、Koa2

上传整个项目到对应目录
cd 到项目目录
npm install
npm run dev测试一下能不能正常启动
使用pm2启动
pm2 start officialservie --namespace /home/opt/app/officialservice -- run dev
pm2 save

四、next

上传整个项目到对应目录
cd 到项目目录
npm install
npm run build
试一下能不能正常启动
npm run start
用pm2启动
pm2 start npm --offcial --namespace /home/opt/app/official -- run start
pm2 save
启动不要占用80端口 指定端口在
package.json里面 "start": "next start -p 3001"

五、Nginx

安装就不说了
打开配置文件:/etc/nginx/nginx.conf
用nginx转发到内网端口

    # 配置转发内网端口
    server {
        listen       80;
        server_name  www.XXXX.com;        
        
        location / {
            proxy_pass http://127.0.0.1:3001;
        }
    }
	# 配置转发vue后台
   server {
    listen       80;
    server_name  www.XXXX.com;
	
	location / {
      proxy_pass http://127.0.0.1:3002;
    }
    
    location /prod/ {
        proxy_pass http://127.0.0.1:3000/;#代理koa端口
    }

    location / {
        root   /home/opt/app/official-admin/dist;
        index index.html index.htm;
        try_files $uri $uri/ /index.html;
        expires -1s;
        add_header Cache-Control no-cache;
        add_header Cache-Control private;
    }
    
    error_page   500 502 503 504  /50x.html;
    location = /50x.html {
        root   html;
        error_page 405 =200  $request_uri;
    }

}   

Vue3.2

npm run build打包后把.dist文件夹上传到对应目录

 类似资料: