前言

多页面其实可以理解为多个独立的业务之间共享部分代码逻辑的实现。业务之间是相对独立的，只是小部分或者大部分的代码是可以共用的，常见的一个场景就是：改头换面形式的换肤。

不同的皮肤之间毫无可复用组件代码的情况下，我们只能将通用的业务逻辑抽离成可复用的部分，简单点来说就是将数据与ui分离，数据是共用部分，ui是各自独立。

最终衍生出的多页面结构大体如下：

pages
├── pageA
│   ├── App.vue
│   ├── index.html
│   ├── main.ts
└── pageB
    ├── App.vue
    ├── index.html
    └── main.ts

那么我们使用vite该如何实现这样的特性呢，下面开始一步步实践它！

此处内容已隐藏回复后方可阅读。

分类： vue 项目实战 标签： vue3多页面vite多入口
版权申明

本文系作者 @木灵鱼儿 原创发布在木灵鱼儿站点。未经许可，禁止转载。

评论

全部评论 20

  1. mario
    mario
    Google Chrome Windows 10
    求指教求指教求指教
    回复
  2. 955864
    955864
    Google Chrome Windows 10
    求指教求指教求指教
    回复
  3. mallray
    mallray
    Google Chrome MacOS
    芝麻请开门！
    回复
  4. 达娃
    达娃
    Google Chrome Windows 10
    教我行不行
    回复
  5. 1
    1
    Google Chrome Windows 10
    教我行不行
    回复
  6. dd
    dd
    Google Chrome Windows 10
    教我行不行
    回复
  7. 行不行
    行不行
    Google Chrome Windows 10
    教教我行不行
    回复
  8. 1
    1
    Google Chrome Windows 10
    教教我行不行
    回复
  9. shber
    shber
    Google Chrome MacOS
    求指教3243任务二
    回复
  10. 1
    1
    Google Chrome MacOS
    123dwa的境外嗲嗲胃口的啊的爱我的
    回复
  1. 1
  2. 2

相关推荐

搭建一个vite+vue+ts的Chrome插件开发模板

木灵鱼儿 783 21 9
插件 模板 vue3

vite+vue3和nuxt3实现低版本浏览器兼容的解决方案（白屏问题）

木灵鱼儿 36048 62 118
vue3 vite 兼容

vite5 打包体积分析（对标webpack包体分析）

木灵鱼儿 2451 103 0
vite 包体分析

vite+vue3 代替require()的hooks

木灵鱼儿 1384 20 0
vue3 vite hooks

解决vite开发时使用vant自动引入组件导致的二次构建

木灵鱼儿 3248 182 1
vant vite 自动加载

vite插件：处理不同平台但共用同一个window下的全局变量sdk方案

木灵鱼儿 1343 0 0
插件 vite sdk

vite多页面实现一个html文件压缩插件

木灵鱼儿 1894 0 1
插件 压缩 html

vite中typescript+eslint+prettier一份官方预设配置

木灵鱼儿 2048 49 0
vue eslint TypeScript

vite中多环境变量务必了解的知识

木灵鱼儿 2773 32 0
环境变量 env vite

vue3 自定义移动端拖拽指令（支持吸边和offset间距以及回调）

木灵鱼儿 1893 176 0
拖拽 自定义指令 vue3
获得点赞 26
文章被阅读 4,672
最后更新 23-10-26 9:42:08

目录

目录