記錄下由于新需求要使用多頁面（MPA）模式，記錄下關于項目配置的信息。
在官方文檔上是這樣配置的：
配置多頁應用
官方文檔省略了項目的改動，例如下圖，compose.html裝載的就是\src\pages\compose\里面的完整SPA項目：
image.png
總結
一個頁面一套SPA，入口文件、路由、資源的路徑都要根據實際情況進行設置。
更新
頁面間跳轉問題
在頁面內可以繼續使用SPA模式的<router-link>，但是頁面之間的跳轉需要使用：
<!-- index.html -->
<a href='/compose.html'>前往compose頁面</a>
刷新不顯示當前路由/404問題
實踐中發現在非首頁的非首路由下，雖然能正常顯示組件，但是進行刷新會出現找不到路由情況，解決方法是采用hash路由模式：
// router.js
// mode: "history", 默認設置
mode: "hash",
這樣，不同頁面之間的指定路由跳轉也可以這樣實現：
<!-- index.html -->
<a href='/compose.html#/paper/library'></a>
該問題是由于history模式需要后臺支持，而本地開發的webpack-dev-server服務只默認配置了單頁應用的路由index.html。
所以還可以通過不使用默認webpack-dev-server，自定義一個本地服務來解決。
/**
* 自定義路由
* */
// http://localhost:8080/
router.get('/', (req, res, next)=>{
sendFile(pathJoin('index.html'), res, next);
});
// http://localhost:8080/home 分配 home.html
router.get('/:home', (req, res, next) => {
sendFile(pathJoin(req.params.home + '.html'), res, next);
});
// http://localhost:8080/index
router.get('/:index', (req, res, next) => {
sendFile(pathJoin(req.params.index + '.html'), res, next);
});
module.exports = app.listen(PORT, err => {
if (err){
return
}
console.log(`Listening at http://${HOST}:${PORT}\n`);
})
