记录下由于新需求要使用多页面（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`);
})
