首先需要一个服务器,我这里用的是阿里云的 CentOS 系统
所需工具: Xshell 6、 Xftp
一、 Xshell 连接 服务器 (照顾没有用过服务器的同学,若已会使用,可直接跳过)
首先,先打开 Xshell ,①点文件 > ②新建 > ③在主机处输入你服务器的公网IP > ④连接 > ⑤输入服务器的用户名 与 密码 > ⑥确定
若想知道服务器的 公网IP 和 用户名 以及 设置密码,先进入您的服务器,然后点击远程连接,就可以看到 公网IP 以及 用户名了
若小圆点为绿色,则代表已成功连接服务器
二、部署 Nodejs 项目
① 首先,想部署 Nodejs 那就必须安装 Nodejs 环境, 推荐以下安装 Nodejs 方法:
在 Xshell 命名行中输入
sudo yum install npm
安装成功后输入 npm -v 来看是否安装成,若返回版本号, 则代表安装完成
安装完 npm 后, 为了方便后续安装其他库,可先安装 cnpm
npm i -g cnpm
若提示
那么 输入 yum update openssl -y
更新完 openssl 后 再重新输入 npm i -g cnpm
来安装 cnpm
, 安装完毕后输入 cnpm i -g n
来安装 N 模块
N 模块安装完毕后,就可以使用 N 模块来安装 Nodejs了,可以输入 sudo n latest
来安装 Nodejs 官方最新版, 也可以输入 sudo n stable
来安装 Nodejs 官方最新稳定版。
安装完毕后运行 node
看是否能进入Nodejs 环境, 若进入了,代表安装成功。
②安装成功后,就可以将 Nodejs 项目 放进服务器了,点击这里绿色的图标来打开 Xftp
打开后就将你的 Nodejs 项目 拖到 右边过去, 我这边准备将项目部署到 80 端口,所以将项目目录重命名为80,推荐不要将 node_modules 文件夹也拖进去, 因为拷贝这个文件夹需要大量的时间而且从 Windows 环境 切换至 Linux 环境不一定兼容,所以推荐通过 cnpm i 来重新安装 依赖包
***注意: node项目中的 端口号设置在 app.js 文件中, 图下的 80 既为部署在服务器中的端口号
***
如果您的服务器是阿里云, 那么你设置端口号后还需在阿里云中设置一下防火墙(80端口 阿里云默认已开启,不需要设置,其他端口则需要设置)
③文件拷贝完成后,就可以运行我们的项目了,在命名行中 cd ./80
进入我们的项目目录, cnpm i
重新安装依赖包, node app.js
运行项目。目前我们项目就成功部署到服务器了,在浏览器地址栏输入你服务器的公网 IP 看是否成功部署。 如果您在项目里用到了 MongoDb 数据库, 那么请看
《在 服务器 安装、运行 MongoBb,以及 开启 MongoDb 进程守护 》这篇文章来 安装及开启 MongoDb, 以及对MongoDb 进行进程守护。
④但还存在一个问题,就是每次关闭 Xshell 的时候,Nodejs 进程也同时被杀掉,解决这个问题需要安装 PM2
来对 Nodejs 进程守护, 输入 cnpm i pm2 -g
来安装 PM2, 安装完成后cd 进项目目录里 输入 pm2 start app.js
,这样就对 Nodejs服务 开启了进程守护。此时,关闭 Xshell 后 Nodejs 服务还能继续运行着,至此,Nodejs 项目部署完成!
三、部署 Vue 项目
① 安装 npm 以及 Nodejs 环境, 看 上面部署 Nodejs 项目的 第①点
② 安装成功后,就可以 打包完的 Vue项目 放进服务器了,点击这里绿色的图标来打开 Xftp
将打包后的Vue项目 (dist文件夹)
拖进 root 文件夹里(注意,)
, 我这里准备部署在 3000 端口, 使用将项目目录重命名为 3000
③拖进去后,在 Xshell 运行 cnpm i -g serve
安装 serve 模块, 安装完之后,在 Xshell cd 你 Vue 的项目目录
, 运行 serve -l 3000
, 其中3000 可改为其他的端口号。
如果您的服务器是阿里云, 那么你设置端口号后还需在阿里云中设置一下防火墙(80端口 阿里云默认已开启,不需要设置,其他端口则需要设置)
目前,Vue 项目就部署在服务器了,在浏览器输入 服务器公网 IP:端口号 看是否部署成功。
④ 但是还存在一个问题,就是每次关闭 Xshell 的时候,serve 进程也同时被杀掉,这里的解决方法是通过 PM2
加 SH脚本文件
的方式来对 serve服务 进行 进程守护:
输入 cnpm i pm2 -g
来安装 PM2, 安装完成后在项目目录里 创建一个 serve.sh
的文件, 右键用记事本打开,里面内容为 serve -l 3000
(其中 3000 可改为其他端口号), 创建完成之后 在 Xshell 进入项目目录,运行 pm2 start serve.sh
, 这样就完成了 对 serve 服务的 进程守护。此时,就算关闭了 Xshell, serve服务也还在进行。