如何在Quasar中配置使用multi page mode多页模式？

Quasar 原生支持多页应用模式，能力和 Vue CLI 提供的 pages 多页配置完全对齐，不需要额外做底层魔改即可使用。

具体配置步骤 #

• 打开项目根目录的配置文件，JS项目对应quasar.config.js，TS项目对应quasar.config.ts
• 在build配置节点下添加multiPage: true，打开全局多页模式开关
• 多页入口默认存放在/src/pages-multi目录下，如果你想自定义入口路径，可以修改配置中sourceFiles.multiPage字段的值
• 每个独立页面对应入口目录下的一个子文件夹，每个子文件夹必须包含两个核心文件：index.js作为页面入口逻辑文件，index.vue作为页面根组件。参考目录结构如下：

src/
└── pages-multi/
    ├── index/          # 对应站点根路径/的默认首页
    │   ├── index.js
    │   └── index.vue
    ├── admin/          # 对应/admin路径的后台独立页面
    │   ├── index.js
    │   └── index.vue
    └── h5/             # 对应/h5路径的移动端独立页面
        ├── index.js
        └── index.vue

• 配置完成后正常执行开发、构建命令即可：开发调试用quasar dev，生产打包用quasar build，脚手架会自动识别所有多页入口，自动完成入口注入、资源分包、路由映射的处理，不需要手动修改webpack的entry配置。

使用注意事项 #

• 多页模式下每个页面都是独立的Vue实例，页面之间的跳转是原生浏览器整页跳转，不会走SPA模式下的前端路由无刷新跳转逻辑
• 如果需要给不同页面单独配置meta标签、全局资源引入规则，直接在对应页面的index.js入口文件里编写配置即可，写法和单页模式的入口配置完全一致
• 多页模式首次启动开发服务、首次生产构建的速度会比单页模式稍慢，属于正常情况，是脚手架并行编译多个页面入口导致的

内容的提问来源于stack exchange，提问作者4xy