分包

开启分包

• vite.config.js

import { defineConfig } from "vite";
import AutoImport from "unplugin-auto-import/vite";
import uni from "@dcloudio/vite-plugin-uni";
import UniPages from "@uni-helper/vite-plugin-uni-pages";
import UniLayouts from "@uni-helper/vite-plugin-uni-layouts";
// https://vitejs.dev/config/
export default async () => {
  const UnoCSS = (await import("unocss/vite")).default;
  return defineConfig({
    plugins: [
      uni(),
      UnoCSS(),
      UniPages({
        routeBlockLang: "json5",
        // 设置分包路径
        subPackages: ["src/pages-sub", "src/pages-sub2"],
      }),
      UniLayouts(),
      AutoImport({
        imports: ["vue", "uni-app", "pinia"],
        dts: true,
        eslintrc: { enabled: true },
      }),
    ],
  });
};

配置

• src>新建 pages-sub>新建 demo1 文件夹>新建 index.vue 文件

<route type="page" lang="json">
  { "style": { "navigationBarTitleText": "分包1" }, "layout": "demo" }
</route>
<template>
  <view>分包第一个</view>
</template>

<script setup></script>

<style scoped></style>

• src>新建 pages-sub2>新建 demo2 文件夹>新建 index.vue 文件

<route type="page" lang="json">
  { "style": { "navigationBarTitleText": "分包2" }, "layout": "demo" }
</route>
<template>
  <view>分包第2个</view>
</template>

<script setup></script>

<style scoped></style>

跳转

<template>
  <view @click="gotologin">登录页</view>
  <view @click="gotofenbao">分包页面1</view>
  <view @click="gotofenbao2">分包页面2</view>
</template>

<script setup>
  import { httpGet } from "@/utils/http";
  const gotologin = () => {
    httpGet("/users").then((res) => {
      console.log(res);
    });
  };
  const gotofenbao = () => {
    uni.navigateTo({
      url: "/pages-sub/demo1/index",
    });
  };
  const gotofenbao2 = () => {
    uni.navigateTo({
      url: "/pages-sub2/demo2/index",
    });
  };
</script>

<style scoped></style>