上传文件至云服务器

一、打包文件

在项目根目录下运行

npm run build

等待命令运行结束后，会发现目录下多了 dist 文件夹，这个文件夹就是我们等下要放到服务器中的。

二、文件传输

1. 打开 Xftp与实例建立连接
2. 云服务器Apache默认的根目录是/var/www/html，因此我们在这个目录下新建music文件夹（这里以我的项目文件名为例）
3. 将项目本地的dist文件夹的内容移到云服务器music文件夹下（准备好前端资源）
4. 将项目本地的server文件夹也移到云服务器dist文件夹下（这里注意不要复制node_modules文件夹）
5. 补充当时后台代码路径：C:\try\Vue-mmPlayer-master\dist
   
   这里再补充一个项目：
   电商后台管理项目：http://arwin521.top/vue/
   

这里将本地dist文件夹中的内容，放在了vue文件夹内，若直接将dist文件夹拖到vue路径下，则会报错

报这样的错实在是太愚蠢了 😦

三、初始化项目

① 输入以下两行代码进入项目

ls指令后下面会显示该目录下的文件夹

② 上传 package.json到服务器目录

③ 在Xshell中安装"dependencies"中项目运行需要的所有依赖

 npm install

全部安装完成后，项目目录下便会有node_modules文件夹了。

④ 启动服务

这里默认已经云服务器已经安装了Nodejs，3000端口也添加到了安全组，且已经为Nodejs创建软链接（使node和npm命令全局有效，若未完成这一步请参考上一篇博文）

node app.js

运行app.js文件，在浏览器打开 服务器公网IP:80（如：263.182.35.68:80），就可以正常运行访问了。这里我使用的是网易云音乐提供的开源的api。

四、安装pm2

上面我们以 node app.js 启动了项目，当我们退出 Xshell 时，进程就会关闭，无法再访问到项目，而 pm2 就是解决这种问题的，以 pm2 启动项目后，退出 Xshell 后依然可以正常访问。

① 安装pm2

npm install -g pm2

注：以 -g 全局安装的插件都在 node 安装目录 bin 文件下

② pm2配置全局变量

我们为了可以在任何目录都可以使用pm2命令，我们将此文件夹加入环境变量

whereis pm2

查询pm2的安装路径 显示是： /opt/node/bin/pm2

ln  -s /opt/node/bin/pm2 /usr/local/bin
pm2

这一步为pm2配置全局变量
注意这里如果重复操作有可能会出现以下错误：
failed to create symbolic link ‘/usr/local/bin/pm2’: File exists
这里只需要删除并重新创建软链，再执行pm2

mv /usr/local/bin/pm2 /tmp/
ln  -s /opt/node/bin/pm2 /usr/local/bin
pm2

③ 启动项目

 cd /var/www/html/music/dist/serverpm2 start app.js

这样以 pm2 启动项目后，退出 Xshell 后，就依然可以正常访问了。
贴上项目跑起来以后的地址：http://arwin521.top/music/arwin/#/music/toplist