From 2a6e8e4b74a41f611c10acfe8296929417088e9d Mon Sep 17 00:00:00 2001 From: WhimsFate Date: Fri, 24 Nov 2023 17:08:49 +0800 Subject: [PATCH] =?UTF-8?q?feat:=20=F0=9F=8E=B8=20=E6=94=AF=E6=8C=81=20ssg?= =?UTF-8?q?=20=E6=A8=A1=E5=BC=8F?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- packages/model/src/clients/client-factory.ts | 10 +++++----- packages/model/src/const.ts | 8 ++++---- packages/model/src/model/class-type.ts | 4 ++-- packages/model/src/model/fn-type.ts | 4 ++-- packages/model/src/model/index.ts | 7 +++++-- packages/model/src/operations/core.ts | 4 ++-- packages/model/src/store/index.ts | 20 ++++++++++++-------- 7 files changed, 32 insertions(+), 25 deletions(-) diff --git a/packages/model/src/clients/client-factory.ts b/packages/model/src/clients/client-factory.ts index 9ecbb1f..088dcc0 100644 --- a/packages/model/src/clients/client-factory.ts +++ b/packages/model/src/clients/client-factory.ts @@ -3,7 +3,7 @@ import type { CommonResponse } from './interceptor'; import type { ClientOptions, Params, FetchPolicy, RequestConfig, RestParams } from './types'; import type { HydrationStatus } from '../store'; import { ReplaySubject } from 'rxjs'; -import { MODE } from '../const'; +import { RENDER_MODE } from '../const'; import { createCache } from '../cache'; import { hash } from '../cache/hash'; @@ -117,14 +117,14 @@ export function clientFactory( if (!opts.fetch) { // 避免Node环境下的判断，所以没法简化写=。=，因为window.fetch会触发一次RHS导致报错 - if (MODE === 'SPA') { + if (RENDER_MODE === 'SPA') { // 小程序因为没有window，所以需要这里绕一下 if (typeof window !== 'undefined' && window.fetch) { opts.fetch = (resource, options) => window.fetch(resource, options); } else { throw new Error('There is no useful "fetch" function'); } - } else if (MODE === 'SSR') { + } else { if (globalThis.fetch) { opts.fetch = (resource, options) => globalThis.fetch(resource, options); } else { @@ -142,7 +142,7 @@ export function clientFactory( const timeoutPromise = new Promise((resolve) => { setTimeout( () => { - if (MODE !== 'SSR' && typeof DOMException !== 'undefined') { + if (RENDER_MODE === 'SPA' && typeof DOMException !== 'undefined') { resolve(new DOMException('The request has been timeout')) } else { resolve(new TimeoutError('The request has been timeout')) @@ -155,7 +155,7 @@ export function clientFactory( }).then((res) => { // 浏览器断网情况下有可能会是null if (res === null) { - res = MODE !== 'SSR' && typeof DOMException !== 'undefined' + res = RENDER_MODE === 'SPA' && typeof DOMException !== 'undefined' ? new DOMException('The request has been timeout') : new TimeoutError('The request has been timeout'); } diff --git a/packages/model/src/const.ts b/packages/model/src/const.ts index 7090aaf..65eade3 100644 --- a/packages/model/src/const.ts +++ b/packages/model/src/const.ts @@ -1,5 +1,5 @@ import type { RebornClient } from './clients'; -import type { storeFactory } from './store'; +import type { RenderMode, storeFactory } from './store'; import { getCurrentInstance, inject } from 'vue-demi'; @@ -15,10 +15,10 @@ export const ROOT_STORE_MAP = new WeakMap< RootStore >(); -export let MODE: 'SPA' | 'SSR' = 'SPA'; +export let RENDER_MODE: RenderMode = 'SPA'; -export function setMode(mode: 'SPA' | 'SSR') { - MODE = mode; +export function setRenderMode(mode: RenderMode) { + RENDER_MODE = mode; } export function getRootStore(): RootStore { diff --git a/packages/model/src/model/class-type.ts b/packages/model/src/model/class-type.ts index 562c31e..b0da415 100644 --- a/packages/model/src/model/class-type.ts +++ b/packages/model/src/model/class-type.ts @@ -9,7 +9,7 @@ import { createRestQuery, } from '../operations'; -import { getRootStore, MODE } from '../const'; +import { getRootStore, RENDER_MODE } from '../const'; import { computed, reactive, getCurrentInstance, type ComputedRef } from 'vue-demi'; import { type StateStatus, useStatus } from '../operations/status'; @@ -360,7 +360,7 @@ export function createModelFromClass(ctor: Constructor): ModelCotrInfo }); // 延迟初始化，保证query间依赖 - if (queryList.length && MODE !== 'SSR') { + if (queryList.length && RENDER_MODE === 'SPA') { queryList.forEach(query => query.init()); } diff --git a/packages/model/src/model/fn-type.ts b/packages/model/src/model/fn-type.ts index 9f025b7..da7d448 100644 --- a/packages/model/src/model/fn-type.ts +++ b/packages/model/src/model/fn-type.ts @@ -16,7 +16,7 @@ import { createRestQuery, } from '../operations'; import { getCurrentInstance, shallowReactive, toRefs, watch } from 'vue-demi'; -import { getRootStore, MODE } from '../const'; +import { getRootStore, RENDER_MODE } from '../const'; import { StateStatus, useStatus } from '../operations/status'; @@ -142,7 +142,7 @@ export function createModelFromCA( const { model, queryList } = fn.creator(); // 延迟初始化，保证query间依赖 - if (queryList.length && MODE !== 'SSR') { + if (queryList.length && RENDER_MODE === 'SPA') { queryList.forEach(query => query.init?.()); } diff --git a/packages/model/src/model/index.ts b/packages/model/src/model/index.ts index 1f39462..be0097a 100644 --- a/packages/model/src/model/index.ts +++ b/packages/model/src/model/index.ts @@ -13,7 +13,7 @@ import { import { createModelFromCA } from './fn-type' import { createModelFromClass } from './class-type'; -import { getRootStore } from '../const'; +import { getRootStore, RENDER_MODE } from '../const'; export type * from './types'; import { createModel, type FNModelConstructor } from './fn-type'; @@ -84,7 +84,10 @@ export function useModel = MyCon>(ctor: T): RebornInst } }); onServerPrefetch(async () => { - await storeModelInstance.instance?.prefetch(); + // SSG 不进行请求 + if(RENDER_MODE !== 'SSG') { + await storeModelInstance.instance?.prefetch(); + } storeModelInstance.count--; if (storeModelInstance.count === 0 && storeModelInstance.instance) { storeModelInstance.instance.destroy(); diff --git a/packages/model/src/operations/core.ts b/packages/model/src/operations/core.ts index 1530b3c..bba7335 100644 --- a/packages/model/src/operations/core.ts +++ b/packages/model/src/operations/core.ts @@ -12,7 +12,7 @@ import { RequestReason, type InfoDataType } from './status'; import { reactive, computed, watch, type ComputedRef } from 'vue-demi'; import { fromWatch } from '../utils'; import { Observable, merge, map } from 'rxjs'; -import { MODE } from '../const'; +import { RENDER_MODE } from '../const'; export { isDef } from '../utils'; @@ -70,7 +70,7 @@ export function generateQueryOptions( let timeout: ReturnType; const poll = () => { - if(MODE === 'SSR') { + if(RENDER_MODE !== 'SPA') { return } clearTimeout(timeout); diff --git a/packages/model/src/store/index.ts b/packages/model/src/store/index.ts index e7469b8..da00743 100644 --- a/packages/model/src/store/index.ts +++ b/packages/model/src/store/index.ts @@ -4,7 +4,9 @@ import type { Ref } from 'vue-demi'; import type { Client, RebornClient } from '../clients'; import { ref } from 'vue-demi'; -import { INJECT_KEY, ROOT_STORE_MAP, setMode } from '../const'; +import { INJECT_KEY, ROOT_STORE_MAP, setRenderMode } from '../const'; + +export type RenderMode = 'SPA' | 'SSR' | 'SSG'; export type GetModelInstance = ReturnType['getModelInstance']; @@ -16,7 +18,9 @@ export type HydrationStatus = Ref<0 | 1 | 2>; export function storeFactory() { const modelMap = new Map['constructor'], ModelInfo>(); - function getModelInstance(constructor: ModelInfo['constructor']): RebornInstanceType | null { + function getModelInstance( + constructor: ModelInfo['constructor'], + ): RebornInstanceType | null { return modelMap.get(constructor)?.instance?.model as unknown as RebornInstanceType; } @@ -75,7 +79,7 @@ export function createStore() { } // 为了适配 vue 不同版本这里只能用 any 了 - function install(app: any, ssrMode: boolean = false) { + function install(app: any, renderMode: boolean | RenderMode = false) { // vue3 if (app.config && typeof app.config.globalProperties === 'object') { app.config.globalProperties.rebornStore = store; @@ -85,7 +89,7 @@ export function createStore() { store, rebornClient, }); - // vue2.7 + // vue2.7 } else { app.mixin({ provide(this) { @@ -94,7 +98,7 @@ export function createStore() { [INJECT_KEY]: { store, rebornClient, - } + }, }; } }, @@ -104,13 +108,13 @@ export function createStore() { ROOT_STORE_MAP.set(this, { store, rebornClient, - }) + }); } - } + }, }); } - setMode(ssrMode ? 'SSR' : 'SPA'); + setRenderMode(typeof renderMode === 'string' ? renderMode : renderMode ? 'SSR' : 'SPA'); } const result = {