当我们完成了一个Vue-cli项目，我们当然是非常开心，然后想将其发布。
那么我们就使用build命令，把我们的项目编译打包：
$ npm run build
打包了之后，我们发现我们得到了一个dist文件夹，不知道怎么启动整个项目。
这时我们又打开了官方文档，看到里面有这么一条：
dist目录需要启动一个 HTTP 服务器来访问 (除非你已经将publicPath配置为了一个相对的值)，所以以file://协议直接打开dist/index.html是不会工作的。在本地预览生产环境构建最简单的方式就是使用一个 Node.js 静态文件服务器，例如 serve：
npm install -g serve
# -s 参数的意思是将其架设在 Single-Page Application 模式下
# 这个模式会处理即将提到的路由问题
serve -s dist
也就是说，只要写一个静态文件服务器就行了。如果我们有个后端，例如Express，那么我们直接使用
app.use(express.static(path.join(__dirname, 'dist')));
就可以做到了。但是这里还有一个问题，那就是我们可能会发现页面有些路由失效了。原因官网也解释了一下：
如果你在 history 模式下使用 Vue Router，是无法搭配简单的静态文件服务器的。例如，如果你使用 Vue Router 为 /todos/42/ 定义了一个路由，开发服务器已经配置了相应的 localhost:3000/todos/42 相应，但是一个为生产环境构建架设的简单的静态服务器会却会返回 404。
这时。我们有个简单的解决方法，就是使用connect-history-api-fallback这个中间件。
官网的教程非常详细而且简单。
使用npm安装：
$ npm install --save connect-history-api-fallback
导入中间件和使用：
// 导入数据包
var history = require('connect-history-api-fallback');
// 使用
var connect = require('connect');
var app = connect()
.use(history())
.listen(3000);
// 或者：
var express = require('express');
var app = express();
app.use(history());
大功告成！
