Vue3+Vite单页面应用(SPA)改造为多页面应用(MPA)

原创于 2025-05-13 11:50:22 发布 · 596 阅读

6 ·

CC 4.0 BY-SA版权

文章标签：

#前端

项目中遇到单页面应用改多页面应用问题
配置多入口后测试环境正常，打包却打不进去。
搞了很就没办只能使用插件 vite-plugin-mpa-plus

## 安装
npm install vite-plugin-mpa-plus
 


## 配置
import { defineConfig } from 'vite'
import mpaPlugin from 'vite-plugin-mpa-plus'

export defineConfig({
    plugins: [
        mpaPlugin({
            pages: {
                app1: {
                    entry: 'src/app/app1/index.ts',
                    filename: '/pages/app1.html',
                    template: 'src/app/app1/index.html',
                    inject: {
                        data: {
                            title: "mpa-app1"
                        }
                    }
                },
                app2: {
                    entry: 'src/app/app2/index.ts',
                    filename: '/pages/app2.html',
                    template: 'src/app/app2/index.html',
                    inject: {
                        data: {
                            title: "mpa-app2"
                        }
                    }
                }
            }
        })
    ]
})

5.测试ok，打包ok