wevu 0.0.1 → 0.0.2-alpha.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.md +122 -0
- package/dist/index-D1r6nN-t.d.cts +78 -0
- package/dist/index-DHBSC7mS.d.mts +78 -0
- package/dist/index.cjs +447 -60
- package/dist/index.d.cts +400 -54
- package/dist/index.d.mts +400 -54
- package/dist/index.mjs +387 -27
- package/dist/store-BcU7YVhB.mjs +638 -0
- package/dist/store-Cmw9vWBT.cjs +764 -0
- package/dist/store.cjs +4 -246
- package/dist/store.d.cts +2 -69
- package/dist/store.d.mts +2 -69
- package/dist/store.mjs +1 -243
- package/package.json +24 -16
- package/dist/ref-0isFdYQ8.d.cts +0 -9
- package/dist/ref-BHYwO374.d.mts +0 -9
- package/dist/ref-DS-k2oUF.mjs +0 -271
- package/dist/ref-DtCdcykK.cjs +0 -349
package/README.md
ADDED
|
@@ -0,0 +1,122 @@
|
|
|
1
|
+
# wevu
|
|
2
|
+
|
|
3
|
+
Vue 3 风格的小程序运行时,复用同款响应式与调度器,通过快照 diff 最小化 `setData`,并内置 Pinia 风格的状态管理。
|
|
4
|
+
|
|
5
|
+
## 特性
|
|
6
|
+
|
|
7
|
+
- `ref`/`reactive`/`computed`/`watch` 与 `nextTick` 同源于 Vue 3 的响应式核心
|
|
8
|
+
- `definePage`/`defineComponent` + `setup` 生命周期钩子(onShow/onPageScroll/onShareAppMessage 等)自动注册微信小程序 Page/Component
|
|
9
|
+
- 快照 diff + 去重调度,最小化 `setData` 体积,支持 `bindModel` 的双向绑定语法
|
|
10
|
+
- 插件、`app.config.globalProperties` 及小程序原生选项可自由组合
|
|
11
|
+
- 内置 `defineStore`/`storeToRefs`/`createStore`,支持 getters、actions、订阅与补丁
|
|
12
|
+
- TypeScript first,输出 ESM/CJS/types
|
|
13
|
+
|
|
14
|
+
## 安装
|
|
15
|
+
|
|
16
|
+
```bash
|
|
17
|
+
pnpm add wevu
|
|
18
|
+
# 或 npm/yarn/pnpm dlx 按需安装
|
|
19
|
+
```
|
|
20
|
+
|
|
21
|
+
## 快速上手:页面定义
|
|
22
|
+
|
|
23
|
+
```ts
|
|
24
|
+
import {
|
|
25
|
+
computed,
|
|
26
|
+
definePage,
|
|
27
|
+
nextTick,
|
|
28
|
+
onMounted,
|
|
29
|
+
onPageScroll,
|
|
30
|
+
onShareAppMessage,
|
|
31
|
+
ref,
|
|
32
|
+
} from 'wevu'
|
|
33
|
+
|
|
34
|
+
definePage(
|
|
35
|
+
{
|
|
36
|
+
data: () => ({ count: 0 }),
|
|
37
|
+
computed: {
|
|
38
|
+
doubled() {
|
|
39
|
+
return this.count * 2
|
|
40
|
+
},
|
|
41
|
+
},
|
|
42
|
+
methods: {
|
|
43
|
+
inc() {
|
|
44
|
+
this.count += 1
|
|
45
|
+
},
|
|
46
|
+
},
|
|
47
|
+
watch: {
|
|
48
|
+
count(n) {
|
|
49
|
+
console.log('count changed', n)
|
|
50
|
+
},
|
|
51
|
+
},
|
|
52
|
+
setup({ state }) {
|
|
53
|
+
const title = computed(() => `count: ${state.count}`)
|
|
54
|
+
const local = ref(0)
|
|
55
|
+
|
|
56
|
+
onMounted(() => {
|
|
57
|
+
nextTick(() => console.log('page ready'))
|
|
58
|
+
})
|
|
59
|
+
onPageScroll((e) => {
|
|
60
|
+
console.log('scrollTop', e?.scrollTop)
|
|
61
|
+
})
|
|
62
|
+
onShareAppMessage(() => ({ title: title.value }))
|
|
63
|
+
|
|
64
|
+
return { local }
|
|
65
|
+
},
|
|
66
|
+
},
|
|
67
|
+
{
|
|
68
|
+
listenPageScroll: true,
|
|
69
|
+
enableShareAppMessage: true,
|
|
70
|
+
},
|
|
71
|
+
)
|
|
72
|
+
```
|
|
73
|
+
|
|
74
|
+
- 当全局存在 `Page`/`Component` 构造器时自动注册;否则可拿到 `component.__wevu_runtime` 手动挂载适配器。
|
|
75
|
+
- 组件场景使用 `defineComponent`,SFC 构建产物可调用 `createWevuComponent`。
|
|
76
|
+
|
|
77
|
+
## 状态管理
|
|
78
|
+
|
|
79
|
+
```ts
|
|
80
|
+
import { createStore, defineStore, storeToRefs } from 'wevu'
|
|
81
|
+
|
|
82
|
+
createStore() // 在小程序入口只需要调用一次,注入插件可选
|
|
83
|
+
|
|
84
|
+
export const useCounter = defineStore('counter', {
|
|
85
|
+
state: () => ({ count: 0 }),
|
|
86
|
+
getters: {
|
|
87
|
+
doubled: state => state.count * 2,
|
|
88
|
+
},
|
|
89
|
+
actions: {
|
|
90
|
+
inc() {
|
|
91
|
+
this.count += 1
|
|
92
|
+
},
|
|
93
|
+
},
|
|
94
|
+
})
|
|
95
|
+
|
|
96
|
+
// 在页面/组件内使用
|
|
97
|
+
const counter = useCounter()
|
|
98
|
+
const { count, doubled } = storeToRefs(counter)
|
|
99
|
+
counter.$subscribe(({ type }) => console.log('mutation', type))
|
|
100
|
+
counter.inc()
|
|
101
|
+
```
|
|
102
|
+
|
|
103
|
+
## 调度与适配
|
|
104
|
+
|
|
105
|
+
- 更新被批量加入微任务队列,`nextTick` 与 Vue 3 行为一致。
|
|
106
|
+
- 对状态做快照 diff,只把变更路径传给 `setData`,避免大对象全量下发。
|
|
107
|
+
- 可在 `createApp().mount(adapter)` 传入自定义 `setData` 适配器(例如单元测试或其他小程序平台)。
|
|
108
|
+
|
|
109
|
+
## 本地开发
|
|
110
|
+
|
|
111
|
+
```bash
|
|
112
|
+
# 从仓库根目录执行
|
|
113
|
+
pnpm dev --filter wevu
|
|
114
|
+
pnpm test --filter wevu
|
|
115
|
+
pnpm build --filter wevu
|
|
116
|
+
```
|
|
117
|
+
|
|
118
|
+
## 更多资料
|
|
119
|
+
|
|
120
|
+
- 架构细节:`packages/wevu/ARCHITECTURE.md`
|
|
121
|
+
- 与 Vue 3 对比:`packages/wevu/VUE3_VS_WEVU.md`
|
|
122
|
+
- 兼容性说明:`packages/wevu/VUE3_COMPAT.md`
|
|
@@ -0,0 +1,78 @@
|
|
|
1
|
+
//#region src/reactivity/ref.d.ts
|
|
2
|
+
interface Ref<T = any> {
|
|
3
|
+
value: T;
|
|
4
|
+
}
|
|
5
|
+
declare function isRef(value: unknown): value is Ref<any>;
|
|
6
|
+
declare function ref<T>(value: T): Ref<T>;
|
|
7
|
+
declare function unref<T>(value: T | Ref<T>): T;
|
|
8
|
+
//#endregion
|
|
9
|
+
//#region src/store/types.d.ts
|
|
10
|
+
type MutationType = 'patch object' | 'patch function';
|
|
11
|
+
interface SubscriptionCallback<S = any> {
|
|
12
|
+
(mutation: {
|
|
13
|
+
type: MutationType;
|
|
14
|
+
storeId: string;
|
|
15
|
+
}, state: S): void;
|
|
16
|
+
}
|
|
17
|
+
interface ActionSubscriber<TStore = any> {
|
|
18
|
+
(context: {
|
|
19
|
+
name: string;
|
|
20
|
+
store: TStore;
|
|
21
|
+
args: any[];
|
|
22
|
+
after: (cb: (result: any) => void) => void;
|
|
23
|
+
onError: (cb: (error: any) => void) => void;
|
|
24
|
+
}): void;
|
|
25
|
+
}
|
|
26
|
+
interface StoreManager {
|
|
27
|
+
install: (app: any) => void;
|
|
28
|
+
_stores: Map<string, any>;
|
|
29
|
+
use: (plugin: (context: {
|
|
30
|
+
store: any;
|
|
31
|
+
}) => void) => StoreManager;
|
|
32
|
+
_plugins: Array<(context: {
|
|
33
|
+
store: any;
|
|
34
|
+
}) => void>;
|
|
35
|
+
}
|
|
36
|
+
type GetterTree<S extends Record<string, any>> = Record<string, (state: S) => any>;
|
|
37
|
+
type StoreGetters<G extends GetterTree<any>> = { [K in keyof G]: G[K] extends ((...args: any[]) => infer R) ? R : never };
|
|
38
|
+
interface DefineStoreOptions<S extends Record<string, any>, G extends GetterTree<S>, A extends Record<string, any>> {
|
|
39
|
+
state: () => S;
|
|
40
|
+
getters?: G & Record<string, (state: S) => any> & ThisType<S & StoreGetters<G> & A>;
|
|
41
|
+
actions?: A & ThisType<S & StoreGetters<G> & A>;
|
|
42
|
+
}
|
|
43
|
+
//#endregion
|
|
44
|
+
//#region src/store/define.d.ts
|
|
45
|
+
type SetupDefinition<T> = () => T;
|
|
46
|
+
declare function defineStore<T extends Record<string, any>>(id: string, setup: SetupDefinition<T>): () => T & {
|
|
47
|
+
$id: string;
|
|
48
|
+
$patch: (patch: Record<string, any> | ((state: any) => void)) => void;
|
|
49
|
+
$subscribe: (cb: (mutation: {
|
|
50
|
+
type: MutationType;
|
|
51
|
+
storeId: string;
|
|
52
|
+
}, state: any) => void, opts?: {
|
|
53
|
+
detached?: boolean;
|
|
54
|
+
}) => () => void;
|
|
55
|
+
$onAction: (cb: (context: any) => void) => () => void;
|
|
56
|
+
};
|
|
57
|
+
declare function defineStore<S extends Record<string, any>, G extends Record<string, any>, A extends Record<string, any>>(id: string, options: DefineStoreOptions<S, G, A>): () => S & StoreGetters<G> & A & {
|
|
58
|
+
$id: string;
|
|
59
|
+
$state: S;
|
|
60
|
+
$patch: (patch: Partial<S> | ((state: S) => void)) => void;
|
|
61
|
+
$reset: () => void;
|
|
62
|
+
$subscribe: (cb: (mutation: {
|
|
63
|
+
type: MutationType;
|
|
64
|
+
storeId: string;
|
|
65
|
+
}, state: S) => void, opts?: {
|
|
66
|
+
detached?: boolean;
|
|
67
|
+
}) => () => void;
|
|
68
|
+
$onAction: (cb: (context: any) => () => void) => () => void;
|
|
69
|
+
};
|
|
70
|
+
//#endregion
|
|
71
|
+
//#region src/store/manager.d.ts
|
|
72
|
+
declare function createStore(): StoreManager;
|
|
73
|
+
//#endregion
|
|
74
|
+
//#region src/store/storeToRefs.d.ts
|
|
75
|
+
type StoreToRefsResult<T extends Record<string, any>> = { [K in keyof T]: T[K] extends ((...args: any[]) => any) ? T[K] : T[K] extends Ref<infer V> ? Ref<V> : Ref<T[K]> };
|
|
76
|
+
declare function storeToRefs<T extends Record<string, any>>(store: T): StoreToRefsResult<T>;
|
|
77
|
+
//#endregion
|
|
78
|
+
export { DefineStoreOptions as a, SubscriptionCallback as c, ref as d, unref as f, ActionSubscriber as i, Ref as l, createStore as n, MutationType as o, defineStore as r, StoreManager as s, storeToRefs as t, isRef as u };
|
|
@@ -0,0 +1,78 @@
|
|
|
1
|
+
//#region src/reactivity/ref.d.ts
|
|
2
|
+
interface Ref<T = any> {
|
|
3
|
+
value: T;
|
|
4
|
+
}
|
|
5
|
+
declare function isRef(value: unknown): value is Ref<any>;
|
|
6
|
+
declare function ref<T>(value: T): Ref<T>;
|
|
7
|
+
declare function unref<T>(value: T | Ref<T>): T;
|
|
8
|
+
//#endregion
|
|
9
|
+
//#region src/store/types.d.ts
|
|
10
|
+
type MutationType = 'patch object' | 'patch function';
|
|
11
|
+
interface SubscriptionCallback<S = any> {
|
|
12
|
+
(mutation: {
|
|
13
|
+
type: MutationType;
|
|
14
|
+
storeId: string;
|
|
15
|
+
}, state: S): void;
|
|
16
|
+
}
|
|
17
|
+
interface ActionSubscriber<TStore = any> {
|
|
18
|
+
(context: {
|
|
19
|
+
name: string;
|
|
20
|
+
store: TStore;
|
|
21
|
+
args: any[];
|
|
22
|
+
after: (cb: (result: any) => void) => void;
|
|
23
|
+
onError: (cb: (error: any) => void) => void;
|
|
24
|
+
}): void;
|
|
25
|
+
}
|
|
26
|
+
interface StoreManager {
|
|
27
|
+
install: (app: any) => void;
|
|
28
|
+
_stores: Map<string, any>;
|
|
29
|
+
use: (plugin: (context: {
|
|
30
|
+
store: any;
|
|
31
|
+
}) => void) => StoreManager;
|
|
32
|
+
_plugins: Array<(context: {
|
|
33
|
+
store: any;
|
|
34
|
+
}) => void>;
|
|
35
|
+
}
|
|
36
|
+
type GetterTree<S extends Record<string, any>> = Record<string, (state: S) => any>;
|
|
37
|
+
type StoreGetters<G extends GetterTree<any>> = { [K in keyof G]: G[K] extends ((...args: any[]) => infer R) ? R : never };
|
|
38
|
+
interface DefineStoreOptions<S extends Record<string, any>, G extends GetterTree<S>, A extends Record<string, any>> {
|
|
39
|
+
state: () => S;
|
|
40
|
+
getters?: G & Record<string, (state: S) => any> & ThisType<S & StoreGetters<G> & A>;
|
|
41
|
+
actions?: A & ThisType<S & StoreGetters<G> & A>;
|
|
42
|
+
}
|
|
43
|
+
//#endregion
|
|
44
|
+
//#region src/store/define.d.ts
|
|
45
|
+
type SetupDefinition<T> = () => T;
|
|
46
|
+
declare function defineStore<T extends Record<string, any>>(id: string, setup: SetupDefinition<T>): () => T & {
|
|
47
|
+
$id: string;
|
|
48
|
+
$patch: (patch: Record<string, any> | ((state: any) => void)) => void;
|
|
49
|
+
$subscribe: (cb: (mutation: {
|
|
50
|
+
type: MutationType;
|
|
51
|
+
storeId: string;
|
|
52
|
+
}, state: any) => void, opts?: {
|
|
53
|
+
detached?: boolean;
|
|
54
|
+
}) => () => void;
|
|
55
|
+
$onAction: (cb: (context: any) => void) => () => void;
|
|
56
|
+
};
|
|
57
|
+
declare function defineStore<S extends Record<string, any>, G extends Record<string, any>, A extends Record<string, any>>(id: string, options: DefineStoreOptions<S, G, A>): () => S & StoreGetters<G> & A & {
|
|
58
|
+
$id: string;
|
|
59
|
+
$state: S;
|
|
60
|
+
$patch: (patch: Partial<S> | ((state: S) => void)) => void;
|
|
61
|
+
$reset: () => void;
|
|
62
|
+
$subscribe: (cb: (mutation: {
|
|
63
|
+
type: MutationType;
|
|
64
|
+
storeId: string;
|
|
65
|
+
}, state: S) => void, opts?: {
|
|
66
|
+
detached?: boolean;
|
|
67
|
+
}) => () => void;
|
|
68
|
+
$onAction: (cb: (context: any) => () => void) => () => void;
|
|
69
|
+
};
|
|
70
|
+
//#endregion
|
|
71
|
+
//#region src/store/manager.d.ts
|
|
72
|
+
declare function createStore(): StoreManager;
|
|
73
|
+
//#endregion
|
|
74
|
+
//#region src/store/storeToRefs.d.ts
|
|
75
|
+
type StoreToRefsResult<T extends Record<string, any>> = { [K in keyof T]: T[K] extends ((...args: any[]) => any) ? T[K] : T[K] extends Ref<infer V> ? Ref<V> : Ref<T[K]> };
|
|
76
|
+
declare function storeToRefs<T extends Record<string, any>>(store: T): StoreToRefsResult<T>;
|
|
77
|
+
//#endregion
|
|
78
|
+
export { DefineStoreOptions as a, SubscriptionCallback as c, ref as d, unref as f, ActionSubscriber as i, Ref as l, createStore as n, MutationType as o, defineStore as r, StoreManager as s, storeToRefs as t, isRef as u };
|