記錄下由于新需求要使用多頁面（MPA）模式匀借，記錄下關(guān)于項目配置的信息颜阐。
在官方文檔上是這樣配置的：
配置多頁應(yīng)用
官方文檔省略了項目的改動，例如下圖吓肋，compose.html裝載的就是\src\pages\compose\里面的完整SPA項目：
image.png
總結(jié)
一個頁面一套SPA，入口文件肤舞、路由、資源的路徑都要根據(jù)實際情況進行設(shè)置李剖。
更新
頁面間跳轉(zhuǎn)問題
在頁面內(nèi)可以繼續(xù)使用SPA模式的<router-link>兆龙，但是頁面之間的跳轉(zhuǎn)需要使用：
<!-- index.html -->
<a href='/compose.html'>前往compose頁面</a>
刷新不顯示當前路由/404問題
實踐中發(fā)現(xiàn)在非首頁的非首路由下敲董，雖然能正常顯示組件，但是進行刷新會出現(xiàn)找不到路由情況慰安，解決方法是采用hash路由模式：
// router.js
// mode: "history", 默認設(shè)置
mode: "hash",
這樣，不同頁面之間的指定路由跳轉(zhuǎn)也可以這樣實現(xiàn)：
<!-- index.html -->
<a href='/compose.html#/paper/library'></a>
該問題是由于history模式需要后臺支持萄窜，而本地開發(fā)的webpack-dev-server服務(wù)只默認配置了單頁應(yīng)用的路由index.html撒桨。
所以還可以通過不使用默認webpack-dev-server查刻，自定義一個本地服務(wù)來解決凤类。
/**
* 自定義路由
* */
// 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`);
})
