當我們完成了一個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());
大功告成！
