Appearance
@uni-helper/vite-plugin-uni-pages
一个用于自动生成 uni-app 页面路由的 Vite 插件
安装
bash
pnpm add -D @uni-helper/vite-plugin-uni-pages基础配置
在 vite.config.ts 中配置插件：
ts
import { defineConfig } from 'vite'
import uni from '@dcloudio/vite-plugin-uni'
import UniPages from '@uni-helper/vite-plugin-uni-pages'
export default defineConfig({
plugins: [
// 必须在 @dcloudio/vite-plugin-uni 之前引入
UniPages({
// 可选，开发者模式下是否禁用自动检测文件变更重新生成 routes
// 默认会在开发者模式下自动检测文件变更重新生成 routes
dts: true,
// 可选，是否生成 pages.d.ts
// 需要将 typescript 添加为开发依赖
// 默认不生成
onChange() {
// 可选，文件变更时的回调
console.log('pages change')
},
}),
uni(),
],
})页面配置
在页面组件中使用 <route> 自定义块来配置页面：
vue
<route lang="json5">
{
// 页面样式配置
style: {
navigationBarTitleText: '页面标题',
},
// 页面元数据，可以在页面中通过 usePageMeta() 获取
meta: {
requiresAuth: true,
},
}
</route>
<template>
<view>页面内容</view>
</template>TypeScript 支持
插件提供完整的 TypeScript 类型支持。在 env.d.ts 中添加：
ts
/// <reference types="@uni-helper/vite-plugin-uni-pages/client" />高级配置
ts
UniPages({
// 可选，页面目录，默认 src/pages
dir: 'src/pages',
// 可选，是否扫描 src/pages 以外的页面
// 默认不扫描
scanDirs: ['src/admin'],
// 可选，排除的文件
// 默认排除所有 components 目录
exclude: ['**/components/**/*'],
// 可选，是否开启调试模式
// 默认不开启
debug: false,
// 可选，route 块使用的语言
// 默认为 json5
routeBlockLang: 'json5',
// 可选，是否支持原生生命周期
// 默认支持
nativeLifecycle: true,
// 可选，分包配置
subPackages: [
{
root: 'src/pages-sub',
pages: [
{
path: 'index',
style: {
navigationBarTitleText: '分包页面',
},
},
],
},
],
})