用二进制包部署太麻烦了 这里直接演示yum安装
首先查看本地源是否有安装包
yum list | grep nodejs
有的话直接安装即可
yum -y install nodejs
没有的话执行下面命令安装拓展源
yum -y install epel-release
安装完epel源再次执行上面查询和安装命令
安装完执行node -v查看是否安装成功并查看版本
然后在查询npm和安装
yum -y install npm
npm -v 检查是否安装成功并查看版本
nodejs和npm部署完就可以打包vue项目了
进入到vue项目包中
指定淘宝源
npm config set registry https://mirrors.huaweicloud.com/repository/npm/
# 淘宝镜像源
https://registry.npmmirror.com
https://registry.npm.taobao.org
# 腾讯云镜像源
http://mirrors.cloud.tencent.com/npm/
# 华为云镜像源
https://mirrors.huaweicloud.com/repository/npm/
# 官方默认全局镜像
https://registry.npmjs.org
npm run build
已经打包完成dist文件夹下就是打包完的代码了
现在访问一下前段页面
先安装nginx 有的话直接跳过
yum -y install nginx
把打包完成的代码包放到nginx默认发布目录下
mv dist/* /usr/share/nginx/html
覆盖输入y 把之前的index.html 替换成我们项目包中的index.html
启动nginx
systemctl start nginx
访问IP即可查看前端页面
记得开放80端口。
这时候刷新的话会找不到网页报错我们需要对nginx配置加一条跳转命令
server块中添加
try_files $uri $uri/ /index.html;
大功告成 。