Vue项目打包后部署到express服务器
Express是基于Node.js平台，快速，开放，极简的Web开发框架，如果前端需要服务器部署自己的项目，可以使用express
首先在vue项目安装 express
npm install express -save
然后根目录下新建app.js文件
const express = require('express')const path = require('path')const app = express()app.use(express.static(path.join(__dirname, 'dist')))app.listen(8081, () => { console.log('app listening on port 8081')})
修改packge.json文件配置
添加 "start": "node app.js"
"scripts": { "serve": "vue-cli-service serve --open", "build": "vue-cli-service build", "lint": "vue-cli-service lint", "start": "node app.js" },
执行 npm run start 运行服务器，打开浏览器输入 localhost:8081 便可以访问到项目
注意：如果使用vue-router的history模式，需要使用connect-history-api-fallback中间件
官方解释： 当你使用 history 模式时，URL 就像正常的 url，不过这种模式要玩好，还需要后台配置支持。因为我们的应用是个单页客户端应用，如果后台没有正确的配置，当用户在浏览器直接访问地址栏中的文件 就会返回 404，这就不好看了。所以呢，你要在服务端增加一个覆盖所有情况的候选资源：如果 URL 匹配不到任何静态资源，则应该返回同一个 index.html 页面，这个页面就是你 app 依赖的页面。
首先安装 connect-history-api-fallback
npm install --save connect-history-api-fallback
然后在 APP.js中引入使用
const express = require('express')const path = require('path')const app = express()// vue-router history模式引入connect-history-api-fallback中间件const history = require('connect-history-api-fallback')// 这句代码需要放在express.static上面app.use(history())app.use(express.static(path.join(__dirname, 'dist')))app.listen(8081, () => { console.log('app listening on port 8081')})