部署nodejs,npm打包vue项目环境部署并完成访问

用二进制包部署太麻烦了 这里直接演示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;
 

大功告成 。

  • 0
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值