Centos7下Vue.js项目部署文档
一.node pm2 环境配置
1.使用服务器下载nodejs
sudo yum -y update
sudo yum -y wget
//在官网选择需要下载的版本
sudo wget https://nodejs.org/dist/v8.12.0/node-v8.12.0-linux-x64.tar.xz
2.node npm环境配置
//解压到当前目录
sudo tar -xvf node-v8.12.0-linux-x64.tar.xz
//改目录名
sudo mv node-v8.12.0-linux-x64 nodejs
//创建链接
sudo ln -s /home/bin/node /usr/local/bin/node
sudo ln -s /home/bin/npm /usr/local/bin/npm
3.运行node -v，npm -v查看版本，正确则node npm环境无误
4.全局安装pm2
npm install pm2 -g
5.创建pm2链接
sudo ln -s /home/bin/pm2 /usr/local/bin/pm2
二.项目打包
vue项目中使用npm run build命令进行打包，生成一个manage目录（默认为dist目录，可修改），这个文件夹就是我们要部署上线的项目。
打包好的文件目录如下：
三.写一个node启动脚本
主要做的事情是读取目录下的单页面文件(index.js)，监听8002端口。
const fs = require('fs');
const path = require('path');
const express = require('express');
const app = express();
app.use(express.static(path.resolve(__dirname, './manage')))
app.get('*', function(req, res) {
const html = fs.readFileSync(path.resolve(__dirname, './manage/index.html'), 'utf-8')
res.send(html)
})
app.listen(8002);
四.生成package.json文件
由于app.js启动脚本使用了express框架，我们可以生成一个package.json文件，将express依赖添加进去。
{
"name": "back_manage",
"version": "1.0.0",
"description": "",
"main": "app.js",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1"
},
"author": "",
"license": "ISC",
"dependencies": {
"express": "^4.15.3"
}
}
五.文件上传
服务器上新建一个文件夹，将vue项目打包文件、app.js启动脚本、package.json配置文件，上传至该文件夹下，注意：三个文件是同级的。
在该文件夹下安装依赖
npm install
安装依赖完成后的项目结构如下：
六、服务启动
登陆到你的服务端,cd到项目文件夹，使用pm2 start app.js就成功启动服务了
pm2的其他一些命令
pm2 show 0（id）//查看某个启动的应用详情
pm2 show list//查看当前启动的所有应用
pm2 stop 0(id)//关闭某个应用
七、其他一些事宜
1、端口的开放：如上该单页面应用监听端口8002，需要将8002端口开放出来，可能涉及到iptables、firewall、阿里云安全组等等，具体方法已在另一份部署文档中详细介绍，此处就不一一赘述。
2、做好以上操作后，理论上可以通过ip+端口在浏览器中查看到项目页面，但实际上第一次访问的时候界面如下：页面空白，找不到资源
然后百度找了原因，修改了一处地方：修改 assetsPublicPath
在config/index.js里面，有个 assetsPublicPath 属性，源码是‘/’，修改成‘./’，加个点
assetsPublicPath: '/',变成assetsPublicPath: './'，项目重新打包。
重启服务后，浏览器端访问如下：
至此，项目部署成功！~~~ 撒花★,°:.☆(￣▽￣)/$:.°★ 。
（备注：如果前后端部署在不同的服务器上，或者要使用域名访问，需要加入nginx。本项目前后端部署在同一台服务器上，暂不考虑）