@meng-xi/vite-plugin 0.0.8 → 0.1.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README-en.md +867 -540
- package/README.md +865 -540
- package/dist/common/index.cjs +1 -1
- package/dist/common/index.d.cts +101 -2
- package/dist/common/index.d.mts +101 -2
- package/dist/common/index.d.ts +101 -2
- package/dist/common/index.mjs +1 -1
- package/dist/index.cjs +1 -1
- package/dist/index.d.cts +2 -2
- package/dist/index.d.mts +2 -2
- package/dist/index.d.ts +2 -2
- package/dist/index.mjs +1 -1
- package/dist/plugins/index.cjs +1 -1
- package/dist/plugins/index.d.cts +432 -173
- package/dist/plugins/index.d.mts +432 -173
- package/dist/plugins/index.d.ts +432 -173
- package/dist/plugins/index.mjs +1 -1
- package/dist/shared/vite-plugin.D6Law9Ke.mjs +706 -0
- package/dist/shared/vite-plugin.D8L9KzuW.cjs +706 -0
- package/dist/shared/vite-plugin.DFjf9wFM.mjs +2 -0
- package/dist/shared/vite-plugin.Tab4qcIM.cjs +2 -0
- package/package.json +72 -72
- package/dist/shared/vite-plugin.Ba9646wL.cjs +0 -1
- package/dist/shared/vite-plugin.C3ejdBNf.mjs +0 -1
- package/dist/shared/vite-plugin.CIQOGuWb.cjs +0 -484
- package/dist/shared/vite-plugin.N63Ts2dO.mjs +0 -484
package/dist/plugins/index.d.cts
CHANGED
|
@@ -254,6 +254,142 @@ interface CopyFileOptions extends BasePluginOptions {
|
|
|
254
254
|
*/
|
|
255
255
|
declare const copyFile: PluginFactory<CopyFileOptions, CopyFileOptions>;
|
|
256
256
|
|
|
257
|
+
/**
|
|
258
|
+
* 图标配置项接口
|
|
259
|
+
*
|
|
260
|
+
* @interface Icon
|
|
261
|
+
*/
|
|
262
|
+
interface Icon {
|
|
263
|
+
/**
|
|
264
|
+
* 图标关系类型
|
|
265
|
+
*/
|
|
266
|
+
rel: string;
|
|
267
|
+
/**
|
|
268
|
+
* 图标 URL
|
|
269
|
+
*/
|
|
270
|
+
href: string;
|
|
271
|
+
/**
|
|
272
|
+
* 图标尺寸
|
|
273
|
+
*/
|
|
274
|
+
sizes?: string;
|
|
275
|
+
/**
|
|
276
|
+
* 图标 MIME 类型
|
|
277
|
+
*/
|
|
278
|
+
type?: string;
|
|
279
|
+
}
|
|
280
|
+
/**
|
|
281
|
+
* 图标文件复制配置选项接口
|
|
282
|
+
*
|
|
283
|
+
* @interface CopyOptions
|
|
284
|
+
*/
|
|
285
|
+
interface CopyOptions {
|
|
286
|
+
/**
|
|
287
|
+
* 图标源文件目录,用于复制图标到打包目录
|
|
288
|
+
*
|
|
289
|
+
* @example 'src/assets/icons'
|
|
290
|
+
*/
|
|
291
|
+
sourceDir: string;
|
|
292
|
+
/**
|
|
293
|
+
* 图标目标目录(打包目录),用于复制图标到打包目录
|
|
294
|
+
*
|
|
295
|
+
* @example 'dist/assets/icons'
|
|
296
|
+
*/
|
|
297
|
+
targetDir: string;
|
|
298
|
+
/**
|
|
299
|
+
* 是否覆盖同名文件
|
|
300
|
+
*
|
|
301
|
+
* @default true
|
|
302
|
+
*/
|
|
303
|
+
overwrite?: boolean;
|
|
304
|
+
/**
|
|
305
|
+
* 是否支持递归复制
|
|
306
|
+
*
|
|
307
|
+
* @default true
|
|
308
|
+
*/
|
|
309
|
+
recursive?: boolean;
|
|
310
|
+
}
|
|
311
|
+
/**
|
|
312
|
+
* 网站图标管理插件的配置选项接口
|
|
313
|
+
*
|
|
314
|
+
* @interface FaviconManagerOptions
|
|
315
|
+
*/
|
|
316
|
+
interface FaviconManagerOptions extends BasePluginOptions {
|
|
317
|
+
/**
|
|
318
|
+
* 图标文件的基础路径,默认为根路径 '/'
|
|
319
|
+
*
|
|
320
|
+
* @default '/'
|
|
321
|
+
* @example '/assets'
|
|
322
|
+
*/
|
|
323
|
+
base?: string;
|
|
324
|
+
/**
|
|
325
|
+
* 图标的完整 URL,如果提供则优先使用(覆盖 base + favicon.ico)
|
|
326
|
+
*
|
|
327
|
+
* @example 'https://example.com/favicon.ico'
|
|
328
|
+
*/
|
|
329
|
+
url?: string;
|
|
330
|
+
/**
|
|
331
|
+
* 自定义的完整 link 标签 HTML,如果提供则优先使用(覆盖 url 和 base)
|
|
332
|
+
*
|
|
333
|
+
* @example '<link rel="icon" href="/favicon.svg" type="image/svg+xml" />'
|
|
334
|
+
*/
|
|
335
|
+
link?: string;
|
|
336
|
+
/**
|
|
337
|
+
* 自定义图标数组,支持多种图标格式和尺寸
|
|
338
|
+
*
|
|
339
|
+
* @example
|
|
340
|
+
* [
|
|
341
|
+
* { rel: 'icon', href: '/favicon.svg', type: 'image/svg+xml' },
|
|
342
|
+
* { rel: 'icon', href: '/favicon-32x32.png', sizes: '32x32', type: 'image/png' },
|
|
343
|
+
* { rel: 'icon', href: '/favicon-16x16.png', sizes: '16x16', type: 'image/png' }
|
|
344
|
+
* ]
|
|
345
|
+
*/
|
|
346
|
+
icons?: Icon[];
|
|
347
|
+
/**
|
|
348
|
+
* 图标文件复制配置选项
|
|
349
|
+
*
|
|
350
|
+
* @remarks
|
|
351
|
+
* 当此对象存在时,才会开启图标文件复制功能
|
|
352
|
+
*/
|
|
353
|
+
copyOptions?: CopyOptions;
|
|
354
|
+
}
|
|
355
|
+
|
|
356
|
+
/**
|
|
357
|
+
* 网站图标管理插件
|
|
358
|
+
*
|
|
359
|
+
* @param options - 插件配置选项,可以是字符串形式的 base 路径或完整的配置对象
|
|
360
|
+
* @returns Vite 插件实例
|
|
361
|
+
*
|
|
362
|
+
* @example
|
|
363
|
+
* ```typescript
|
|
364
|
+
* // 基本使用
|
|
365
|
+
* faviconManager() // 使用默认配置
|
|
366
|
+
*
|
|
367
|
+
* // 使用字符串配置 base 路径
|
|
368
|
+
* faviconManager('/assets')
|
|
369
|
+
*
|
|
370
|
+
* // 使用完整配置
|
|
371
|
+
* faviconManager({
|
|
372
|
+
* base: '/assets',
|
|
373
|
+
* icons: [
|
|
374
|
+
* { rel: 'icon', href: '/favicon.svg', type: 'image/svg+xml' },
|
|
375
|
+
* { rel: 'icon', href: '/favicon-32x32.png', sizes: '32x32', type: 'image/png' }
|
|
376
|
+
* ],
|
|
377
|
+
* copyOptions: {
|
|
378
|
+
* sourceDir: 'src/assets/icons',
|
|
379
|
+
* targetDir: 'dist/assets/icons'
|
|
380
|
+
* }
|
|
381
|
+
* })
|
|
382
|
+
* ```
|
|
383
|
+
*
|
|
384
|
+
* @remarks
|
|
385
|
+
* 该插件在构建过程中:
|
|
386
|
+
* 1. 将网站图标(favicon)的 link 标签注入到 HTML 文件的 `<head>` 中
|
|
387
|
+
* 2. 如果配置了 copyOptions,将图标文件复制到目标目录
|
|
388
|
+
*
|
|
389
|
+
* 支持自定义图标链接、图标数组配置以及图标文件复制功能。
|
|
390
|
+
*/
|
|
391
|
+
declare const faviconManager: PluginFactory<FaviconManagerOptions, string | FaviconManagerOptions>;
|
|
392
|
+
|
|
257
393
|
/**
|
|
258
394
|
* 路由元信息
|
|
259
395
|
*/
|
|
@@ -621,141 +757,6 @@ interface GenerateVersionOptions extends BasePluginOptions {
|
|
|
621
757
|
*/
|
|
622
758
|
declare const generateVersion: PluginFactory<GenerateVersionOptions, GenerateVersionOptions>;
|
|
623
759
|
|
|
624
|
-
/**
|
|
625
|
-
* 图标配置项接口
|
|
626
|
-
*
|
|
627
|
-
* @interface Icon
|
|
628
|
-
*/
|
|
629
|
-
interface Icon {
|
|
630
|
-
/**
|
|
631
|
-
* 图标关系类型
|
|
632
|
-
*/
|
|
633
|
-
rel: string;
|
|
634
|
-
/**
|
|
635
|
-
* 图标 URL
|
|
636
|
-
*/
|
|
637
|
-
href: string;
|
|
638
|
-
/**
|
|
639
|
-
* 图标尺寸
|
|
640
|
-
*/
|
|
641
|
-
sizes?: string;
|
|
642
|
-
/**
|
|
643
|
-
* 图标 MIME 类型
|
|
644
|
-
*/
|
|
645
|
-
type?: string;
|
|
646
|
-
}
|
|
647
|
-
/**
|
|
648
|
-
* 图标文件复制配置选项接口
|
|
649
|
-
*
|
|
650
|
-
* @interface CopyOptions
|
|
651
|
-
*/
|
|
652
|
-
interface CopyOptions {
|
|
653
|
-
/**
|
|
654
|
-
* 图标源文件目录,用于复制图标到打包目录
|
|
655
|
-
*
|
|
656
|
-
* @example 'src/assets/icons'
|
|
657
|
-
*/
|
|
658
|
-
sourceDir: string;
|
|
659
|
-
/**
|
|
660
|
-
* 图标目标目录(打包目录),用于复制图标到打包目录
|
|
661
|
-
*
|
|
662
|
-
* @example 'dist/assets/icons'
|
|
663
|
-
*/
|
|
664
|
-
targetDir: string;
|
|
665
|
-
/**
|
|
666
|
-
* 是否覆盖同名文件
|
|
667
|
-
*
|
|
668
|
-
* @default true
|
|
669
|
-
*/
|
|
670
|
-
overwrite?: boolean;
|
|
671
|
-
/**
|
|
672
|
-
* 是否支持递归复制
|
|
673
|
-
*
|
|
674
|
-
* @default true
|
|
675
|
-
*/
|
|
676
|
-
recursive?: boolean;
|
|
677
|
-
}
|
|
678
|
-
/**
|
|
679
|
-
* 注入网站图标链接的配置选项接口
|
|
680
|
-
*
|
|
681
|
-
* @interface InjectIcoOptions
|
|
682
|
-
*/
|
|
683
|
-
interface InjectIcoOptions extends BasePluginOptions {
|
|
684
|
-
/**
|
|
685
|
-
* 图标文件的基础路径,默认为根路径 '/'
|
|
686
|
-
*
|
|
687
|
-
* @default '/'
|
|
688
|
-
* @example '/assets'
|
|
689
|
-
*/
|
|
690
|
-
base?: string;
|
|
691
|
-
/**
|
|
692
|
-
* 图标的完整 URL,如果提供则优先使用(覆盖 base + favicon.ico)
|
|
693
|
-
*
|
|
694
|
-
* @example 'https://example.com/favicon.ico'
|
|
695
|
-
*/
|
|
696
|
-
url?: string;
|
|
697
|
-
/**
|
|
698
|
-
* 自定义的完整 link 标签 HTML,如果提供则优先使用(覆盖 url 和 base)
|
|
699
|
-
*
|
|
700
|
-
* @example '<link rel="icon" href="/favicon.svg" type="image/svg+xml" />'
|
|
701
|
-
*/
|
|
702
|
-
link?: string;
|
|
703
|
-
/**
|
|
704
|
-
* 自定义图标数组,支持多种图标格式和尺寸
|
|
705
|
-
*
|
|
706
|
-
* @example
|
|
707
|
-
* [
|
|
708
|
-
* { rel: 'icon', href: '/favicon.svg', type: 'image/svg+xml' },
|
|
709
|
-
* { rel: 'icon', href: '/favicon-32x32.png', sizes: '32x32', type: 'image/png' },
|
|
710
|
-
* { rel: 'icon', href: '/favicon-16x16.png', sizes: '16x16', type: 'image/png' }
|
|
711
|
-
* ]
|
|
712
|
-
*/
|
|
713
|
-
icons?: Icon[];
|
|
714
|
-
/**
|
|
715
|
-
* 图标文件复制配置选项
|
|
716
|
-
*
|
|
717
|
-
* @remarks
|
|
718
|
-
* 当此对象存在时,才会开启图标文件复制功能
|
|
719
|
-
*/
|
|
720
|
-
copyOptions?: CopyOptions;
|
|
721
|
-
}
|
|
722
|
-
|
|
723
|
-
/**
|
|
724
|
-
* 创建注入图标插件实例
|
|
725
|
-
*
|
|
726
|
-
* @export
|
|
727
|
-
* @param {string | InjectIcoOptions} [options] - 插件配置选项,可以是字符串形式的 base 路径或完整的配置对象
|
|
728
|
-
* @returns {Plugin} Vite 插件实例,用于在构建过程中注入图标链接到 HTML 文件
|
|
729
|
-
* @example
|
|
730
|
-
* ```typescript
|
|
731
|
-
* // 基本使用
|
|
732
|
-
* injectIco() // 使用默认配置
|
|
733
|
-
*
|
|
734
|
-
* // 使用字符串配置 base 路径
|
|
735
|
-
* injectIco('/assets')
|
|
736
|
-
*
|
|
737
|
-
* // 使用完整配置
|
|
738
|
-
* injectIco({
|
|
739
|
-
* base: '/assets',
|
|
740
|
-
* icons: [
|
|
741
|
-
* { rel: 'icon', href: '/favicon.svg', type: 'image/svg+xml' },
|
|
742
|
-
* { rel: 'icon', href: '/favicon-32x32.png', sizes: '32x32', type: 'image/png' }
|
|
743
|
-
* ],
|
|
744
|
-
* copyOptions: {
|
|
745
|
-
* sourceDir: 'src/assets/icons',
|
|
746
|
-
* targetDir: 'dist/assets/icons'
|
|
747
|
-
* }
|
|
748
|
-
* })
|
|
749
|
-
* ```
|
|
750
|
-
* @remarks
|
|
751
|
-
* 该函数创建并返回一个 Vite 插件实例,该实例会在构建过程中:
|
|
752
|
-
* 1. 将图标链接注入到 HTML 文件的 `<head>` 标签中
|
|
753
|
-
* 2. 如果配置了 copyOptions,将图标文件复制到目标目录
|
|
754
|
-
*
|
|
755
|
-
* 支持自定义图标链接、图标数组配置以及图标文件复制功能。
|
|
756
|
-
*/
|
|
757
|
-
declare const injectIco: PluginFactory<InjectIcoOptions, string | InjectIcoOptions>;
|
|
758
|
-
|
|
759
760
|
/**
|
|
760
761
|
* Loading 组件的显示位置
|
|
761
762
|
*
|
|
@@ -765,7 +766,7 @@ declare const injectIco: PluginFactory<InjectIcoOptions, string | InjectIcoOptio
|
|
|
765
766
|
*
|
|
766
767
|
* @example
|
|
767
768
|
* ```typescript
|
|
768
|
-
*
|
|
769
|
+
* loadingManager({ position: 'top' })
|
|
769
770
|
* ```
|
|
770
771
|
*/
|
|
771
772
|
type LoadingPosition = 'center' | 'top' | 'bottom';
|
|
@@ -779,7 +780,7 @@ type LoadingPosition = 'center' | 'top' | 'bottom';
|
|
|
779
780
|
* @example
|
|
780
781
|
* ```typescript
|
|
781
782
|
* // 自动拦截所有 fetch 请求
|
|
782
|
-
*
|
|
783
|
+
* loadingManager({ autoBind: 'fetch' })
|
|
783
784
|
* ```
|
|
784
785
|
*/
|
|
785
786
|
type AutoBindMode = 'fetch' | 'xhr' | 'all' | 'none';
|
|
@@ -792,14 +793,14 @@ type AutoBindMode = 'fetch' | 'xhr' | 'all' | 'none';
|
|
|
792
793
|
*
|
|
793
794
|
* @example
|
|
794
795
|
* ```typescript
|
|
795
|
-
*
|
|
796
|
+
* loadingManager({ spinnerType: 'dots' })
|
|
796
797
|
* ```
|
|
797
798
|
*/
|
|
798
799
|
type SpinnerType = 'spinner' | 'dots' | 'pulse' | 'bar';
|
|
799
800
|
/**
|
|
800
801
|
* 当 `defaultVisible` 为 `true` 时,loading 的自动隐藏时机
|
|
801
802
|
*
|
|
802
|
-
* @remarks 仅在 {@link
|
|
803
|
+
* @remarks 仅在 {@link LoadingManagerOptions.defaultVisible} 为 `true` 时生效,
|
|
803
804
|
* 决定 loading 在页面加载过程中的自动隐藏策略
|
|
804
805
|
*
|
|
805
806
|
* @defaultValue `'DOMContentLoaded'`
|
|
@@ -807,7 +808,7 @@ type SpinnerType = 'spinner' | 'dots' | 'pulse' | 'bar';
|
|
|
807
808
|
* @example
|
|
808
809
|
* ```typescript
|
|
809
810
|
* // Vue/React SPA:手动控制隐藏时机
|
|
810
|
-
*
|
|
811
|
+
* loadingManager({ defaultVisible: true, autoHideOn: 'manual' })
|
|
811
812
|
* // 在应用入口:window.__LOADING_MANAGER__.hide()
|
|
812
813
|
* ```
|
|
813
814
|
*/
|
|
@@ -901,13 +902,23 @@ interface LoadingStyle {
|
|
|
901
902
|
*/
|
|
902
903
|
zIndex?: number;
|
|
903
904
|
/**
|
|
904
|
-
*
|
|
905
|
+
* 是否启用遮罩层的指针事件
|
|
905
906
|
*
|
|
906
907
|
* @remarks
|
|
907
|
-
* -
|
|
908
|
-
* - `true
|
|
908
|
+
* 对应 CSS `pointer-events` 属性,控制遮罩层是否拦截用户的点击、滚动等交互操作:
|
|
909
|
+
* - `true`(默认):启用指针事件(`pointer-events: auto`),遮罩层阻止所有交互
|
|
910
|
+
* - `false`:禁用指针事件(`pointer-events: none`),遮罩层允许交互穿透
|
|
909
911
|
*
|
|
910
|
-
* @defaultValue `
|
|
912
|
+
* @defaultValue `true`
|
|
913
|
+
*
|
|
914
|
+
* @example
|
|
915
|
+
* ```typescript
|
|
916
|
+
* // 阻止交互(默认行为)
|
|
917
|
+
* loadingManager({ style: { pointerEvents: true } })
|
|
918
|
+
*
|
|
919
|
+
* // 允许交互穿透(如仅展示加载状态,不阻止操作)
|
|
920
|
+
* loadingManager({ style: { pointerEvents: false } })
|
|
921
|
+
* ```
|
|
911
922
|
*/
|
|
912
923
|
pointerEvents?: boolean;
|
|
913
924
|
/**
|
|
@@ -1137,12 +1148,54 @@ interface LoadingManager {
|
|
|
1137
1148
|
*/
|
|
1138
1149
|
forceHide(): void;
|
|
1139
1150
|
/**
|
|
1140
|
-
*
|
|
1151
|
+
* 切换 loading 的显示/隐藏状态
|
|
1141
1152
|
*
|
|
1142
|
-
* @remarks
|
|
1143
|
-
*
|
|
1153
|
+
* @remarks 如果当前显示则调用 {@link hide},如果当前隐藏则调用 {@link show}
|
|
1154
|
+
*
|
|
1155
|
+
* @param text - 可选,切换为显示时的文本内容;不传则保留默认文本
|
|
1156
|
+
*
|
|
1157
|
+
* @example
|
|
1158
|
+
* ```typescript
|
|
1159
|
+
* window.__LOADING_MANAGER__.toggle()
|
|
1160
|
+
* window.__LOADING_MANAGER__.toggle('正在加载...')
|
|
1161
|
+
* ```
|
|
1144
1162
|
*/
|
|
1145
|
-
|
|
1163
|
+
toggle(text?: string): void;
|
|
1164
|
+
/**
|
|
1165
|
+
* 启用遮罩层的指针事件,拦截所有点击和滚动操作
|
|
1166
|
+
*
|
|
1167
|
+
* @remarks 设置遮罩层的 `pointer-events: auto`,恢复默认的交互拦截行为。
|
|
1168
|
+
* 适用于运行时动态启用交互阻止,例如在特定操作期间临时锁定页面
|
|
1169
|
+
*
|
|
1170
|
+
* @example
|
|
1171
|
+
* ```typescript
|
|
1172
|
+
* window.__LOADING_MANAGER__.enablePointerEvents()
|
|
1173
|
+
* ```
|
|
1174
|
+
*/
|
|
1175
|
+
enablePointerEvents(): void;
|
|
1176
|
+
/**
|
|
1177
|
+
* 禁用遮罩层的指针事件,允许交互穿透
|
|
1178
|
+
*
|
|
1179
|
+
* @remarks 设置遮罩层的 `pointer-events: none`,使鼠标事件穿透到下层元素。
|
|
1180
|
+
* 适用于运行时动态禁用交互阻止,例如需要用户在 loading 期间仍能操作页面
|
|
1181
|
+
*
|
|
1182
|
+
* @example
|
|
1183
|
+
* ```typescript
|
|
1184
|
+
* window.__LOADING_MANAGER__.disablePointerEvents()
|
|
1185
|
+
* ```
|
|
1186
|
+
*/
|
|
1187
|
+
disablePointerEvents(): void;
|
|
1188
|
+
/**
|
|
1189
|
+
* 切换遮罩层的指针事件状态
|
|
1190
|
+
*
|
|
1191
|
+
* @remarks 如果当前启用指针事件则调用 {@link disablePointerEvents},如果当前禁用则调用 {@link enablePointerEvents}
|
|
1192
|
+
*
|
|
1193
|
+
* @example
|
|
1194
|
+
* ```typescript
|
|
1195
|
+
* window.__LOADING_MANAGER__.togglePointerEvents()
|
|
1196
|
+
* ```
|
|
1197
|
+
*/
|
|
1198
|
+
togglePointerEvents(): void;
|
|
1146
1199
|
/**
|
|
1147
1200
|
* 更新 loading 文本内容
|
|
1148
1201
|
*
|
|
@@ -1160,19 +1213,32 @@ interface LoadingManager {
|
|
|
1160
1213
|
* @returns `true` 表示 loading 正在显示且未被销毁
|
|
1161
1214
|
*/
|
|
1162
1215
|
isVisible(): boolean;
|
|
1216
|
+
/**
|
|
1217
|
+
* 获取当前遮罩层是否启用了指针事件
|
|
1218
|
+
*
|
|
1219
|
+
* @returns `true` 表示指针事件已启用(遮罩层拦截交互),`false` 表示已禁用(允许穿透)
|
|
1220
|
+
*/
|
|
1221
|
+
isPointerEventsEnabled(): boolean;
|
|
1163
1222
|
/**
|
|
1164
1223
|
* 获取当前挂起的请求数量
|
|
1165
1224
|
*
|
|
1166
1225
|
* @returns 当前正在进行的、被拦截的请求数量
|
|
1167
1226
|
*/
|
|
1168
1227
|
getPendingCount(): number;
|
|
1228
|
+
/**
|
|
1229
|
+
* 销毁 loading 实例
|
|
1230
|
+
*
|
|
1231
|
+
* @remarks 清理 DOM 元素、事件监听器,并恢复原始的 fetch/XHR 拦截。
|
|
1232
|
+
* 销毁后所有其他方法调用将被安全忽略
|
|
1233
|
+
*/
|
|
1234
|
+
destroy(): void;
|
|
1169
1235
|
}
|
|
1170
1236
|
/**
|
|
1171
|
-
*
|
|
1237
|
+
* loadingManager 插件的配置选项
|
|
1172
1238
|
*
|
|
1173
1239
|
* @remarks 继承自 {@link BasePluginOptions},包含 loading 的所有可配置项
|
|
1174
1240
|
*/
|
|
1175
|
-
interface
|
|
1241
|
+
interface LoadingManagerOptions extends BasePluginOptions {
|
|
1176
1242
|
/**
|
|
1177
1243
|
* Loading 显示位置
|
|
1178
1244
|
*
|
|
@@ -1240,7 +1306,7 @@ interface InjectLoadingOptions extends BasePluginOptions {
|
|
|
1240
1306
|
*
|
|
1241
1307
|
* @example
|
|
1242
1308
|
* ```typescript
|
|
1243
|
-
*
|
|
1309
|
+
* loadingManager({ globalName: '__MY_LOADING__' })
|
|
1244
1310
|
* // 使用:window.__MY_LOADING__.show()
|
|
1245
1311
|
* ```
|
|
1246
1312
|
*/
|
|
@@ -1254,7 +1320,7 @@ interface InjectLoadingOptions extends BasePluginOptions {
|
|
|
1254
1320
|
*
|
|
1255
1321
|
* @example
|
|
1256
1322
|
* ```typescript
|
|
1257
|
-
*
|
|
1323
|
+
* loadingManager({
|
|
1258
1324
|
* customTemplate: '<div class="my-loader"><span data-loading-text></span></div>'
|
|
1259
1325
|
* })
|
|
1260
1326
|
* ```
|
|
@@ -1274,13 +1340,13 @@ interface InjectLoadingOptions extends BasePluginOptions {
|
|
|
1274
1340
|
* @example
|
|
1275
1341
|
* ```typescript
|
|
1276
1342
|
* // 白屏阶段即显示 loading,DOMContentLoaded 后自动隐藏
|
|
1277
|
-
*
|
|
1343
|
+
* loadingManager({ defaultVisible: true, autoHideOn: 'DOMContentLoaded' })
|
|
1278
1344
|
*
|
|
1279
1345
|
* // 白屏阶段即显示 loading,所有资源加载完成后自动隐藏
|
|
1280
|
-
*
|
|
1346
|
+
* loadingManager({ defaultVisible: true, autoHideOn: 'load' })
|
|
1281
1347
|
*
|
|
1282
1348
|
* // Vue/React SPA:白屏阶段即显示,框架渲染完成后手动隐藏
|
|
1283
|
-
*
|
|
1349
|
+
* loadingManager({ defaultVisible: true, autoHideOn: 'manual' })
|
|
1284
1350
|
* // 在应用入口处:window.__LOADING_MANAGER__.hide()
|
|
1285
1351
|
* ```
|
|
1286
1352
|
*/
|
|
@@ -1305,7 +1371,7 @@ interface InjectLoadingOptions extends BasePluginOptions {
|
|
|
1305
1371
|
*
|
|
1306
1372
|
* @example
|
|
1307
1373
|
* ```typescript
|
|
1308
|
-
*
|
|
1374
|
+
* loadingManager({
|
|
1309
1375
|
* callbacks: {
|
|
1310
1376
|
* onShow: 'console.log("loading shown")',
|
|
1311
1377
|
* onBeforeShow: 'return true'
|
|
@@ -1317,29 +1383,29 @@ interface InjectLoadingOptions extends BasePluginOptions {
|
|
|
1317
1383
|
}
|
|
1318
1384
|
|
|
1319
1385
|
/**
|
|
1320
|
-
*
|
|
1386
|
+
* 全局 Loading 状态管理插件
|
|
1321
1387
|
*
|
|
1322
|
-
* @param options - 插件配置选项,详见 {@link
|
|
1388
|
+
* @param options - 插件配置选项,详见 {@link LoadingManagerOptions}
|
|
1323
1389
|
* @returns Vite 插件实例
|
|
1324
1390
|
*
|
|
1325
1391
|
* @example
|
|
1326
1392
|
* ```typescript
|
|
1327
1393
|
* // 基本使用
|
|
1328
|
-
*
|
|
1394
|
+
* loadingManager()
|
|
1329
1395
|
*
|
|
1330
1396
|
* // 自定义位置和文本
|
|
1331
|
-
*
|
|
1397
|
+
* loadingManager({
|
|
1332
1398
|
* position: 'top',
|
|
1333
1399
|
* defaultText: '请稍候...'
|
|
1334
1400
|
* })
|
|
1335
1401
|
*
|
|
1336
1402
|
* // 使用不同类型的加载图标
|
|
1337
|
-
*
|
|
1403
|
+
* loadingManager({
|
|
1338
1404
|
* spinnerType: 'dots', // spinner | dots | pulse | bar
|
|
1339
1405
|
* })
|
|
1340
1406
|
*
|
|
1341
1407
|
* // 自动拦截 fetch 请求
|
|
1342
|
-
*
|
|
1408
|
+
* loadingManager({
|
|
1343
1409
|
* autoBind: 'fetch',
|
|
1344
1410
|
* requestFilter: {
|
|
1345
1411
|
* excludeUrls: [/\/api\/health/],
|
|
@@ -1348,7 +1414,7 @@ interface InjectLoadingOptions extends BasePluginOptions {
|
|
|
1348
1414
|
* })
|
|
1349
1415
|
*
|
|
1350
1416
|
* // 自定义样式(含模糊背景)
|
|
1351
|
-
*
|
|
1417
|
+
* loadingManager({
|
|
1352
1418
|
* style: {
|
|
1353
1419
|
* overlayColor: 'rgba(0, 0, 0, 0.5)',
|
|
1354
1420
|
* spinnerColor: '#ff6b6b',
|
|
@@ -1359,7 +1425,7 @@ interface InjectLoadingOptions extends BasePluginOptions {
|
|
|
1359
1425
|
* })
|
|
1360
1426
|
*
|
|
1361
1427
|
* // 自定义过渡动画
|
|
1362
|
-
*
|
|
1428
|
+
* loadingManager({
|
|
1363
1429
|
* transition: {
|
|
1364
1430
|
* enabled: true,
|
|
1365
1431
|
* duration: 300,
|
|
@@ -1368,7 +1434,7 @@ interface InjectLoadingOptions extends BasePluginOptions {
|
|
|
1368
1434
|
* })
|
|
1369
1435
|
*
|
|
1370
1436
|
* // 防抖隐藏(避免快速闪烁)
|
|
1371
|
-
*
|
|
1437
|
+
* loadingManager({
|
|
1372
1438
|
* debounceHide: {
|
|
1373
1439
|
* enabled: true,
|
|
1374
1440
|
* duration: 100
|
|
@@ -1376,7 +1442,7 @@ interface InjectLoadingOptions extends BasePluginOptions {
|
|
|
1376
1442
|
* })
|
|
1377
1443
|
*
|
|
1378
1444
|
* // 生命周期回调
|
|
1379
|
-
*
|
|
1445
|
+
* loadingManager({
|
|
1380
1446
|
* callbacks: {
|
|
1381
1447
|
* onShow: 'console.log("loading shown")',
|
|
1382
1448
|
* onBeforeShow: 'return true', // 返回 false 可阻止显示
|
|
@@ -1385,24 +1451,24 @@ interface InjectLoadingOptions extends BasePluginOptions {
|
|
|
1385
1451
|
* })
|
|
1386
1452
|
*
|
|
1387
1453
|
* // 自定义模板
|
|
1388
|
-
*
|
|
1454
|
+
* loadingManager({
|
|
1389
1455
|
* customTemplate: '<div class="my-loader"><span data-loading-text></span></div>'
|
|
1390
1456
|
* })
|
|
1391
1457
|
*
|
|
1392
1458
|
* // 白屏阶段即显示 loading,DOMContentLoaded 后自动隐藏
|
|
1393
|
-
*
|
|
1459
|
+
* loadingManager({
|
|
1394
1460
|
* defaultVisible: true,
|
|
1395
1461
|
* autoHideOn: 'DOMContentLoaded'
|
|
1396
1462
|
* })
|
|
1397
1463
|
*
|
|
1398
1464
|
* // 白屏阶段即显示 loading,所有资源加载完成后自动隐藏
|
|
1399
|
-
*
|
|
1465
|
+
* loadingManager({
|
|
1400
1466
|
* defaultVisible: true,
|
|
1401
1467
|
* autoHideOn: 'load'
|
|
1402
1468
|
* })
|
|
1403
1469
|
*
|
|
1404
1470
|
* // Vue/React SPA:白屏阶段即显示,框架渲染完成后手动隐藏
|
|
1405
|
-
*
|
|
1471
|
+
* loadingManager({
|
|
1406
1472
|
* defaultVisible: true,
|
|
1407
1473
|
* autoHideOn: 'manual'
|
|
1408
1474
|
* })
|
|
@@ -1451,7 +1517,200 @@ interface InjectLoadingOptions extends BasePluginOptions {
|
|
|
1451
1517
|
* window.__LOADING_MANAGER__.destroy()
|
|
1452
1518
|
* ```
|
|
1453
1519
|
*/
|
|
1454
|
-
declare const
|
|
1520
|
+
declare const loadingManager: PluginFactory<LoadingManagerOptions, LoadingManagerOptions>;
|
|
1521
|
+
|
|
1522
|
+
/**
|
|
1523
|
+
* 版本来源类型
|
|
1524
|
+
*
|
|
1525
|
+
* @description
|
|
1526
|
+
* - 'define': 从 Vite define 注入的全局变量中读取(如 __APP_VERSION__)
|
|
1527
|
+
* - 'file': 从版本文件(如 version.json)中读取
|
|
1528
|
+
* - 'auto': 自动检测,优先使用 define,回退到 file
|
|
1529
|
+
*/
|
|
1530
|
+
type VersionSource = 'define' | 'file' | 'auto';
|
|
1531
|
+
/**
|
|
1532
|
+
* 更新提示 UI 样式
|
|
1533
|
+
*
|
|
1534
|
+
* @description
|
|
1535
|
+
* - 'modal': 居中弹窗,需用户手动操作
|
|
1536
|
+
* - 'banner': 顶部横幅,可自动消失或手动关闭
|
|
1537
|
+
* - 'toast': 底部轻提示,自动消失
|
|
1538
|
+
*/
|
|
1539
|
+
type PromptStyle = 'modal' | 'banner' | 'toast';
|
|
1540
|
+
/**
|
|
1541
|
+
* 版本更新检查器的配置选项接口
|
|
1542
|
+
*
|
|
1543
|
+
* @interface VersionUpdateCheckerOptions
|
|
1544
|
+
*/
|
|
1545
|
+
interface VersionUpdateCheckerOptions extends BasePluginOptions {
|
|
1546
|
+
/**
|
|
1547
|
+
* 当前版本号的来源
|
|
1548
|
+
*
|
|
1549
|
+
* @default 'auto'
|
|
1550
|
+
*/
|
|
1551
|
+
versionSource?: VersionSource;
|
|
1552
|
+
/**
|
|
1553
|
+
* define 模式下的全局变量名
|
|
1554
|
+
*
|
|
1555
|
+
* @description 当 versionSource 为 'define' 或 'auto' 时,
|
|
1556
|
+
* 从此全局变量读取当前构建版本号
|
|
1557
|
+
*
|
|
1558
|
+
* @default '__APP_VERSION__'
|
|
1559
|
+
*/
|
|
1560
|
+
defineName?: string;
|
|
1561
|
+
/**
|
|
1562
|
+
* 版本检查文件的 URL 路径
|
|
1563
|
+
*
|
|
1564
|
+
* @description 客户端将定期请求此 URL 获取最新版本号,
|
|
1565
|
+
* 并与当前版本号对比判断是否有更新
|
|
1566
|
+
*
|
|
1567
|
+
* @default '/version.json'
|
|
1568
|
+
*/
|
|
1569
|
+
checkUrl?: string;
|
|
1570
|
+
/**
|
|
1571
|
+
* 版本检查间隔时间(毫秒)
|
|
1572
|
+
*
|
|
1573
|
+
* @default 300000(5 分钟)
|
|
1574
|
+
*/
|
|
1575
|
+
checkInterval?: number;
|
|
1576
|
+
/**
|
|
1577
|
+
* 页面可见性变化时是否立即检查
|
|
1578
|
+
*
|
|
1579
|
+
* @description 当用户从其他标签页切回时,立即检查版本更新,
|
|
1580
|
+
* 而不是等待下一个定时周期
|
|
1581
|
+
*
|
|
1582
|
+
* @default true
|
|
1583
|
+
*/
|
|
1584
|
+
checkOnVisibilityChange?: boolean;
|
|
1585
|
+
/**
|
|
1586
|
+
* 是否在开发模式下启用版本检查
|
|
1587
|
+
*
|
|
1588
|
+
* @default false
|
|
1589
|
+
*/
|
|
1590
|
+
enableInDev?: boolean;
|
|
1591
|
+
/**
|
|
1592
|
+
* 更新提示 UI 样式
|
|
1593
|
+
*
|
|
1594
|
+
* @default 'modal'
|
|
1595
|
+
*/
|
|
1596
|
+
promptStyle?: PromptStyle;
|
|
1597
|
+
/**
|
|
1598
|
+
* 更新提示消息文本
|
|
1599
|
+
*
|
|
1600
|
+
* @default '发现新版本,是否立即刷新获取最新内容?'
|
|
1601
|
+
*/
|
|
1602
|
+
promptMessage?: string;
|
|
1603
|
+
/**
|
|
1604
|
+
* 刷新按钮文本
|
|
1605
|
+
*
|
|
1606
|
+
* @default '立即刷新'
|
|
1607
|
+
*/
|
|
1608
|
+
refreshButtonText?: string;
|
|
1609
|
+
/**
|
|
1610
|
+
* 忽略按钮文本
|
|
1611
|
+
*
|
|
1612
|
+
* @default '稍后再说'
|
|
1613
|
+
*/
|
|
1614
|
+
dismissButtonText?: string;
|
|
1615
|
+
/**
|
|
1616
|
+
* 自定义提示 UI 的 HTML 模板
|
|
1617
|
+
*
|
|
1618
|
+
* @description 替换内置的提示 UI,模板中可使用以下占位符:
|
|
1619
|
+
* - {{message}}: 提示消息
|
|
1620
|
+
* - {{currentVersion}}: 当前版本号
|
|
1621
|
+
* - {{newVersion}}: 新版本号
|
|
1622
|
+
* - {{refreshButton}}: 刷新按钮
|
|
1623
|
+
* - {{dismissButton}}: 忽略按钮
|
|
1624
|
+
*
|
|
1625
|
+
* 模板中不允许包含 <script> 标签
|
|
1626
|
+
*/
|
|
1627
|
+
customPromptTemplate?: string;
|
|
1628
|
+
/**
|
|
1629
|
+
* 自定义样式字符串
|
|
1630
|
+
*
|
|
1631
|
+
* @description 追加到内置样式之后的自定义 CSS
|
|
1632
|
+
*/
|
|
1633
|
+
customStyle?: string;
|
|
1634
|
+
/**
|
|
1635
|
+
* 发现新版本时的回调(函数体字符串)
|
|
1636
|
+
*
|
|
1637
|
+
* @description 回调以函数体字符串形式提供,因为需要注入到客户端代码中。
|
|
1638
|
+
* 可用变量:currentVersion、newVersion
|
|
1639
|
+
*
|
|
1640
|
+
* @example 'console.log("新版本:", newVersion); return true;'
|
|
1641
|
+
*/
|
|
1642
|
+
onUpdateAvailable?: string;
|
|
1643
|
+
/**
|
|
1644
|
+
* 用户选择刷新时的回调(函数体字符串)
|
|
1645
|
+
*
|
|
1646
|
+
* @example 'console.log("用户选择刷新");'
|
|
1647
|
+
*/
|
|
1648
|
+
onRefresh?: string;
|
|
1649
|
+
/**
|
|
1650
|
+
* 用户选择忽略时的回调(函数体字符串)
|
|
1651
|
+
*
|
|
1652
|
+
* @example 'console.log("用户选择忽略");'
|
|
1653
|
+
*/
|
|
1654
|
+
onDismiss?: string;
|
|
1655
|
+
}
|
|
1656
|
+
|
|
1657
|
+
/**
|
|
1658
|
+
* 版本更新检查器插件
|
|
1659
|
+
*
|
|
1660
|
+
* @param options - 插件配置选项,详见 {@link VersionUpdateCheckerOptions}
|
|
1661
|
+
* @returns Vite 插件实例
|
|
1662
|
+
*
|
|
1663
|
+
* @example
|
|
1664
|
+
* ```typescript
|
|
1665
|
+
* // 基本使用 — 配合 generateVersion 插件
|
|
1666
|
+
* generateVersion({
|
|
1667
|
+
* format: 'datetime',
|
|
1668
|
+
* outputType: 'both',
|
|
1669
|
+
* defineName: '__APP_VERSION__'
|
|
1670
|
+
* }),
|
|
1671
|
+
* versionUpdateChecker()
|
|
1672
|
+
*
|
|
1673
|
+
* // 自定义检查间隔和提示样式
|
|
1674
|
+
* versionUpdateChecker({
|
|
1675
|
+
* checkInterval: 60000, // 1 分钟检查一次
|
|
1676
|
+
* promptStyle: 'banner' // 顶部横幅提示
|
|
1677
|
+
* })
|
|
1678
|
+
*
|
|
1679
|
+
* // 自定义提示消息和回调
|
|
1680
|
+
* versionUpdateChecker({
|
|
1681
|
+
* promptMessage: '系统已更新,请刷新页面',
|
|
1682
|
+
* onUpdateAvailable: 'console.log("新版本:", newVersion); return true;',
|
|
1683
|
+
* onRefresh: 'console.log("用户选择刷新");',
|
|
1684
|
+
* onDismiss: 'console.log("用户选择忽略");'
|
|
1685
|
+
* })
|
|
1686
|
+
*
|
|
1687
|
+
* // 开发模式也启用
|
|
1688
|
+
* versionUpdateChecker({
|
|
1689
|
+
* enableInDev: true,
|
|
1690
|
+
* checkInterval: 10000
|
|
1691
|
+
* })
|
|
1692
|
+
*
|
|
1693
|
+
* // 自定义 UI 模板
|
|
1694
|
+
* versionUpdateChecker({
|
|
1695
|
+
* customPromptTemplate: '<div class="my-update-prompt">{{message}} {{refreshButton}}</div>',
|
|
1696
|
+
* customStyle: '.my-update-prompt { background: #333; color: #fff; }'
|
|
1697
|
+
* })
|
|
1698
|
+
* ```
|
|
1699
|
+
*
|
|
1700
|
+
* @remarks
|
|
1701
|
+
* 该插件通常与 `generateVersion` 插件配合使用:
|
|
1702
|
+
* - `generateVersion` 负责在构建时生成版本号并输出到 `version.json` 文件和全局变量
|
|
1703
|
+
* - `versionUpdateChecker` 负责在运行时定期检查版本号变更并提示用户刷新
|
|
1704
|
+
*
|
|
1705
|
+
* 工作原理:
|
|
1706
|
+
* 1. 页面加载时,从全局变量(如 `__APP_VERSION__`)读取当前版本号
|
|
1707
|
+
* 2. 定期请求 `version.json` 获取最新版本号
|
|
1708
|
+
* 3. 当版本号不一致时,显示更新提示 UI
|
|
1709
|
+
* 4. 用户点击"立即刷新"后执行 `location.reload()`
|
|
1710
|
+
* 5. 用户点击"稍后再说"后隐藏提示,本次会话不再提醒
|
|
1711
|
+
* 6. 页面可见性变化时(如从其他标签页切回)立即检查更新
|
|
1712
|
+
*/
|
|
1713
|
+
declare const versionUpdateChecker: PluginFactory<VersionUpdateCheckerOptions, VersionUpdateCheckerOptions>;
|
|
1455
1714
|
|
|
1456
|
-
export { buildProgress, copyFile, generateRouter, generateVersion,
|
|
1457
|
-
export type { AutoBindMode, AutoHideOn, BuildPhase, BuildProgressOptions, CopyFileOptions, DebounceHide, DelayShow, GenerateRouterOptions, GenerateVersionOptions, Icon,
|
|
1715
|
+
export { buildProgress, copyFile, faviconManager, generateRouter, generateVersion, loadingManager, versionUpdateChecker };
|
|
1716
|
+
export type { AutoBindMode, AutoHideOn, BuildPhase, BuildProgressOptions, CopyFileOptions, DebounceHide, DelayShow, FaviconManagerOptions, GenerateRouterOptions, GenerateVersionOptions, Icon, LoadingCallbacks, LoadingManager, LoadingManagerOptions, LoadingPosition, LoadingStyle, MinDisplayTime, NameStrategy, OutputFormat, OutputType, ProgressFormat, ProgressTheme, PromptStyle, RequestFilter, RouteConfig, RouteMeta, SpinnerType, TransitionConfig, UniAppPageConfig, UniAppPagesJson, UniAppTabBarConfig, VersionFormat, VersionSource, VersionUpdateCheckerOptions };
|