更新记录

2.0.0（2025-09-26） 下载此版本

Changelog

All notable changes to this project will be documented in this file.

[2.0.0] - 2025-09-26

Breaking Changes

• 包的顶层仅保留命名导出，移除默认导出（避免 CJS named+default 警告，使用方式更清晰）
• 提供两个互斥入口，必须二选一使用：
  • UniViteRootInjector（推荐，高性能、类型友好，支持按页面/按需注入与自动路由类型生成）
  • UniViteInsetLoader（兼容旧版，沿用 pages.json 注入方式）

Features

• 新增 RootInjector 入口：
  • 支持基于 components 的 const 断言自动推断插入键名
  • 支持 dts 生成路由 Path 类型
  • 支持按页面 handlePos 精细化注入与 exclude 排除策略
  • 内置 pages.json 缓存与增量计算优化，构建更快
• 文档拆分为两份：docs/UniViteRootInjector.md 与 docs/UniViteInsetLoader.md，并随包发布

Docs

• README 重写：给出两种入口、互斥说明、性能建议、使用示例
• RootInjector 文档补充精确类型定义与默认值说明

Chore

• 打包配置简化与优化：ESM + CJS、sourcemap、dts 输出、外部依赖声明
• 包含 docs 目录到 npm 包（package.json files 增加 docs）

[1.0.10] - 2025-09-XX

• 旧版本维护节点，细节见对应 Git 历史

1.0.7（2025-08-07） 下载此版本

优化更新支持script标签 module lang

1.0.6（2024-10-11） 下载此版本

处理page-meta标签被包裹导致无法生效等问题

平台兼容性

uni-app(4.07)

其他

vite-inset-loader

一个专为 UniApp（Vue3 + Vite）设计的编译期注入插件集合，现提供两个入口（互斥，二选一）：

• UniViteRootInjector（推荐）：高性能、类型友好，支持按页面/按需注入与自动路由类型生成。
• UniViteInsetLoader（兼容）：沿用旧版 vite-inset-loader 的 pages.json 驱动注入方式。

文档入口：

• UniViteRootInjector 使用与配置（推荐）
• UniViteInsetLoader 使用与配置（兼容）

性能建议：大型项目优先使用 UniViteRootInjector，具备路由映射缓存与增量计算优化，整体构建体验更好。

demo

demo 仓库

安装

pnpm add vite-inset-loader -D
# 或
npm i vite-inset-loader -D
# 或
yarn add vite-inset-loader -D

插件入口（二选一）

注意：两个入口不能同时启用。若在同一 Vite 配置中同时使用，会抛出互斥错误。

使用 UniViteRootInjector（推荐）

import { defineConfig } from 'vite';
import uni from '@dcloudio/vite-plugin-uni';
import { UniViteRootInjector } from 'vite-inset-loader';
import { resolve } from 'node:path';
// 若配置 dts，请在项目中显式引用生成的类型（例如 types/auto-route.d.ts）
// import type { Path } from './types/auto-route';

const components = {
  message: '<gy-message ref="messageRef"></gy-message>',
  dialog: '<gy-dialog ref="dialogRef"></gy-dialog>',
} as const;

export default defineConfig({
  plugins: [
    uni(),
    UniViteRootInjector({
      dts: resolve(__dirname, 'types/auto-route.d.ts'),
      components,
      insertPos: {
        mode: 'GLOBAL',
        exclude: ['pages/login/index'],
        handlePos: [
          { page: 'pages/home/index', insert: ['message'] },
        ],
      },
    }),
  ],
});

RootInjector 配置项（节选）

• dts: 路由类型文件生成路径，缺省生成到默认位置
• components: 组件别名到组件字符串的映射，支持类型推断
• insertPos: 注入策略（GLOBAL/排除/页面特定配置）
• includes/watchFile: 可选的包含与监听配置

使用 UniViteInsetLoader（兼容模式）

import { defineConfig } from 'vite';
import uni from '@dcloudio/vite-plugin-uni';
import { UniViteInsetLoader } from 'vite-inset-loader';

export default defineConfig(() => ({
  plugins: [
    UniViteInsetLoader({ include: 'src' }),
    uni(),
  ],
}));

viteInsetLoader 方法配置项

pages.json 配置（用于 InsetLoader）

insetLoader 依赖 pages.json 中的配置来注入标签：

{
  "insetLoader": {
    "config": {
      "message": "<GyMessage ref='messageRef'></GyMessage>",
      "dialog": "<GyDialog ref='dialogRef'></GyDialog>"
    },
    "label": ["message", "dialog"],
    "package": {
      "label": "span",
      "options": {
        "class": "dev-style",
        "style": { "font-size": "24px" },
        "data-attr": "content"
      }
    }
  }
}

页面级覆盖示例（优先级高于全局配置）：

{
  "pages": [
    {
      "path": "pages/home/index",
      "style": {
        "label": ["message"],
        "package": {
          "label": "span",
          "options": {
            "class": "dev-style",
            "style": { "font-size": "24px" },
            "data-attr": "123468"
          }
        }
      }
    }
  ]
}

注册全局组件（仅 InsetLoader 场景）

import { createSSRApp } from 'vue';
import App from './App.vue';
import GyMessage from './components/GyMessage/index.vue';

export const createApp = () => {
  const app = createSSRApp(App);
  app.component('GyMessage', GyMessage); // 需与 pages.json 的 config 别名匹配
  return { app };
};

常见问题

• 两个入口不能同时使用：内部会检测并抛出错误，用任意一个即可。
• RootInjector 性能更好：更适合页面较多或注入规则复杂的项目。
• 仅命名导出：从 v1.0.10 起包只提供命名导出（不再有默认导出）。

进一步阅读

• UniViteRootInjector 使用与配置（推荐）：./docs/UniViteRootInjector.md
• UniViteInsetLoader 使用与配置（兼容）：./docs/UniViteInsetLoader.md

致谢

• vite-inset-loader 的灵感来源于 vue-inset-loader（早期适配 Webpack + Vue2）。本项目在其基础上适配了 Vite + Vue3 并进行了能力扩展与性能优化。

欢迎提出你的建议与 PR：GitHub 仓库