centos部署vue项目教程

版本:centos8.2、node-v14.18.1、pm2

  • 准备工作
  1. 在本地进入到你的vue项目,执行npm run build打包命令,打包之后本地会出现dist文件夹,如下图

在这里插入图片描述

  1. dist文件夹以及package.json 文件上传到centos服务器上的 /home/项目名 目录下,当然文件夹可以自己定义,例如我存放的目录是/home/gzhong-admin,并新建一个app.js文件,文件内容如下
//定义目录
const fs = require('fs');
const path = require('path');
const express = require('express');
const app = express();
//vue目录
app.use(express.static(path.resolve(__dirname, './dist')))

app.get('*', function(req, res) {
    const html = fs.readFileSync(path.resolve(__dirname, './dist/index.html'), 'utf-8')
    res.send(html)
})
//定义启动的端口号
app.listen(18000);

完成这一步后目录结构如下:
在这里插入图片描述

  1. 安装pm2,如果已经安装,请略过这步

执行命令

npm install pm2 -g

安装完成后使用命令,查看是否安装成功

pm2 list

在这里插入图片描述

  • 运行项目
  1. 进入到项目目录下,我这里是**/home/gzhong-admin**
cd /home/gzhong-admin
  1. 执行install命令安装依赖包
npm install
  1. 安装成功后启动项目,使用刚才安装到的pm2命令
pm2 start app.js

到这就可以访问你的网站了,使用http://{IP}:{端口}即可,因为我设置的是18000,还需要到服务器把端口开放出来,其实是看个人需求了

  • 0
    点赞
  • 10
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值