vue项目部署到linux服务器

186 阅读2分钟

step1:linux安装nginx

step2:修改nginx.conf文件

cd /usr/local/nginx/conf

image.png

step3:重启nginx

cd /usr/local/nginx/sbin

./nginx 启动

./nginx -s stop 关闭

./nginx -s reload 重启


step4:本地build

step5:将dist文件夹扔到服务器上


以上step4和step5是手动打包。可以使用jenkins构建任务,通过Publish over SSH将项目部署到远程服务器

以下是部署到jenkins的步骤: 参考 参考

step1: jenkins安装插件 Publish over SSH

step2: jenkins所在部署机器,生成公钥,把公钥复制到目标服务器的 authorized_keys 中

 生成公钥:ssh-keygen   ssh-keygen -m PEM -t rsa -b 4096  (两种生成公钥的方法,生成的格式不同,第一种生成的公钥可能会在验证的时候有问题)
目标服务器的authorized_keys位置:/root/.ssh(如果已经有了,直接在该文件中继续换行添加即可。)

step3:在jenkins中配置Publish over SSH Name:你起的可以分辨服务器的名称。

Hostname:目标服务器ip
Username:登录目标服务器的账号
Remote Directory:将jenkins构建的文件发送到目标服务器的哪个文件夹下
配置完成后,test configuration 。Success则代表成功。失败的话,可能是1. key的格式不对,按照上述生成公钥的第二种方法,重新生成一遍;2. 没有到服务器的22端口权限

image.png

step4:jenkins创建任务

image.png

# 默认在workspace目录 既仓库的根目录
# 安装依赖
npm install
# 删除旧的dist文件
rm -rf dist
# 重新build代码
npm run build
# 将build好的文件 打成tar包方便传送
cd dist
tar -zcvf dist.tar.gz *
cd ..
echo '打包完毕'
cd /web/api_platform_fe/dist
tar -zxvf dist.tar.gz  
rm -rf dist.tar.gz
cd /usr/local/nginx/sbin
./nginx -s reload

step6:nginx.conf文件配置

image.png

多个跨域处理

image.png

blog.csdn.net/speano/arti…

log地址:

/usr/local/nginx/logs

参考