Linux CentOS + Nodejs + Koa部署vue项目

你的名字 2023-06-06 03:46 49阅读 0赞

注：服务器为CentOS 7.3.1611，使用Xshell6 + Xftp6工具完成服务器远程操作

# 一、安装Node环境 #

通过Xshell连接服务器成功之后就可以开始以下工作

#### 1.清理工作 ####

###### 如果之前有安装过nodejs，用自带的包管理命名先删除一次 ######

yum remove nodejs npm -y

然后手动进入以下目录删除相关文件  
进入 /usr/local/lib 删除所有 node 和 node\_modules文件夹  
进入 /usr/local/include 删除所有 node 和 node\_modules 文件夹  
进入 /usr/local/bin 删除 node 的可执行文件

#### 2.去官网复制node安装包链接 ####

[https://nodejs.org/en/download/][https_nodejs.org_en_download]![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2xpaGVmZWlfY29kZXI_size_16_color_FFFFFF_t_70]

#### 3.在Xshell里cd到安装目录 ####

cd /usr/local/

#### 4.输入命令链接开始下载nodejs安装包 ####

wget https://nodejs.org/dist/v10.16.0/node-v10.16.0-linux-x64.tar.xz

#### 5.输入命令两步解压 ####

xz -d node-v10.16.0-linux-x64.tar.xz
    tar -xvf node-v10.16.0-linux-x64.tar

#### 6.重名解压的文件夹名称为nodejs ####

mv node-v10.16.0-linux-x64 nodejs

#### 7.进入解压目录 ####

cd nodejs

#### 8.创建软连接 ####

格式：ln -s 软件安装路径 系统执行路径

ln -s  /usr/local/nodejs/bin/node /usr/local/bin/node
    ln -s  /usr/local/nodejs/bin/npm /usr/local/bin/npm

如果不小心输错了路径，重新创建会提示：‘ln: 无法创建符号链接"/usr/local/bin/npm": 文件已存在’，输入`rm /usr/local/bin/npm`命令清除后可以重新创建

#### 9.测试 ####

node -v
    npm -v

#### 10.安装cnpm淘宝镜像并创建软链接 ####

npm install -g cnpm
    ln -s /usr/local/nodejs/bin/cnpm /usr/local/bin/cnpm

# 二、用Koa搭建web服务 #

#### 1.在Xshell里cd到指定目录 ####

cd /var/www/

注：如果没有www目录就在var目录下输入命令`mkdir www`手动创建一个，并进入到www目录

#### 2.创建web服务项目文件夹 ####

mkdir demo

#### 3.cd进入项目目录 ####

cd demo

#### 4.初始化项目生成package.json ####

npm init -y

注：这里的-y意思是省略创建过程中一直输yes的步骤

#### 5.安装koa和koa-static ####

cnpm i koa koa-static -D

#### 6.创建web服务程序文件app.js ####

mkdir app.js

#### 7.编写web服务程序代码app.js ####

# 三、打包部署vue项目 #

#### 1.在本地开发工具里打包需要部署的vue项目 ####

npm run build

生成的dist文件夹就是我们需要部署到服务器上的项目  
![在这里插入图片描述][20190531111438777.png]

#### 2.把dist文件夹通过Xftp工具复制到服务器的var/www/demo目录下 ####

![11160623264.png)][11160623264.png]

# 四、启动web服务 #

#### 1.在Xshell里cd到var/www/demo目录，输入以下命令启动web服务程序 ####

node app.js

如果能正常访问项目地址表示已经搭建成功。

请求后端接口跨域方案请见：  
**跨域代理方案1**：[Nginx使用教程][Nginx]  
**跨域代理方案2**：[Nodejs 中使用http-proxy-middleware实现代理跨域][Nodejs _http-proxy-middleware]

#### 2.安装PM2托管Node Web服务程序 ####

在xshell里用node默认的启动方式有一个缺点，xshell退出后nodejs项目便会停止  
使用pm2这个托管工具可以很好的解决这个问题，而且当代码有更改时会自动重启服务更新

1.首先多按两次ctrl +c结束之前的运行程序，接着输入下面的命令安装pm2并创建软链接

cnpm install pm2 -g
    ln -s /usr/local/nodejs/bin/pm2 /usr/local/bin/pm2

2.然后输入下面的命令启动托管任务，`abc`为托管项目定义的名称

pm2 start app.js --name abc

**以下为pm2常用命令说明**

<table> 
 <thead> 
  <tr> 
   <th>命令</th> 
   <th>功能</th> 
  </tr> 
 </thead> 
 <tbody> 
  <tr> 
   <td>pm2 start app.js --name abc</td> 
   <td>启动(--name为定义任务名称的指令，abc为任务名称值)</td> 
  </tr> 
  <tr> 
   <td>pm2 start app.js --watch</td> 
   <td>启动( --watch为监听应用目录的变化的指令)</td> 
  </tr> 
  <tr> 
   <td>pm2 restart app.js</td> 
   <td>重启任务</td> 
  </tr> 
  <tr> 
   <td>pm2 stop abc</td> 
   <td>结束(abc为任务名称或id)</td> 
  </tr> 
  <tr> 
   <td>pm2 list </td> 
   <td>查看所有任务列表</td> 
  </tr> 
 </tbody> 
</table>

**pm2基本功能命令**

<table> 
 <thead> 
  <tr> 
   <th>功能</th> 
   <th>命令</th> 
  </tr> 
 </thead> 
 <tbody> 
  <tr> 
   <td>启动进程/应用</td> 
   <td>pm2 start bin/abc 或 pm2 start app.js</td> 
  </tr> 
  <tr> 
   <td>重命名进程/应用</td> 
   <td>pm2 start app.js --name abc</td> 
  </tr> 
  <tr> 
   <td>添加进程/应用</td> 
   <td>pm2 start bin/abc --watch</td> 
  </tr> 
  <tr> 
   <td>结束进程/应用 </td> 
   <td>pm2 stop abc</td> 
  </tr> 
  <tr> 
   <td>结束所有进程/应用</td> 
   <td>pm2 stop all</td> 
  </tr> 
  <tr> 
   <td>删除进程/应用 </td> 
   <td>pm2 delete abc</td> 
  </tr> 
  <tr> 
   <td>删除所有进程/应用 </td> 
   <td>pm2 delete all</td> 
  </tr> 
  <tr> 
   <td>列出所有进程/应用</td> 
   <td>pm2 list</td> 
  </tr> 
  <tr> 
   <td>查看进程/应用详情 </td> 
   <td>pm2 show abc 或 pm2 describe abc</td> 
  </tr> 
  <tr> 
   <td>查看进程/应用资源消耗</td> 
   <td>pm2 monit</td> 
  </tr> 
  <tr> 
   <td>查看进程/应用日志</td> 
   <td> pm2 logs abc</td> 
  </tr> 
  <tr> 
   <td>查看所有进程/应用日志</td> 
   <td>pm2 logs</td> 
  </tr> 
  <tr> 
   <td>重新启动进程/应用</td> 
   <td>pm2 restart abc</td> 
  </tr> 
  <tr> 
   <td>重新启动所有进程/应用</td> 
   <td>pm2 restart all</td> 
  </tr> 
 </tbody> 
</table>

pm2使用教程链接： [https://blog.csdn.net/lihefei\_coder/article/details/103270348][https_blog.csdn.net_lihefei_coder_article_details_103270348]

扩展教程：[Linux CentOS Nodejs+Express部署vue项目][Linux CentOS Nodejs_Express_vue]

[https_nodejs.org_en_download]: https://nodejs.org/en/download/
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2xpaGVmZWlfY29kZXI_size_16_color_FFFFFF_t_70]: /images/20230601/7108a6ca4f9146d18f166af4ccf2fb49.png
[20190531111438777.png]: /images/20230601/26a32db2de96459a8c41fe69230674d8.png
[11160623264.png]: /images/20230601/43109cc22b994e4ab3a95ef77b71d058.png
[Nginx]: https://blog.csdn.net/lihefei_coder/article/details/100017410
[Nodejs _http-proxy-middleware]: https://blog.csdn.net/lihefei_coder/article/details/100033870
[https_blog.csdn.net_lihefei_coder_article_details_103270348]: https://blog.csdn.net/lihefei_coder/article/details/103270348
[Linux CentOS Nodejs_Express_vue]: https://blog.csdn.net/lihefei_coder/article/details/90700965