From 1b4ae2a4b15f98f4e42610df6cecf2e09a864b60 Mon Sep 17 00:00:00 2001 From: daleksandrov Date: Sat, 24 Dec 2022 00:58:01 +0100 Subject: [PATCH] feat: bootstrap.util.ts - mv bootstrap logic to util --- src/client/index.tsx | 19 +++++++------------ src/client/utils/bootstrap.util.ts | 10 ++++++++++ src/client/utils/index.ts | 1 + src/server/middleware/render/render.util.ts | 2 +- 4 files changed, 19 insertions(+), 13 deletions(-) create mode 100644 src/client/utils/bootstrap.util.ts diff --git a/src/client/index.tsx b/src/client/index.tsx index 053d09d..45edadf 100644 --- a/src/client/index.tsx +++ b/src/client/index.tsx @@ -1,16 +1,11 @@ import { BrowserRouter } from 'react-router-dom' -import { createRoot, hydrateRoot } from 'react-dom/client' -import { loadableReady } from '@loadable/component' +import { bootstrap } from 'client/utils' import { App } from '@shared/app' -loadableReady(() => { - const container = document.getElementById('root') as HTMLElement - const AppContainer = ( - - - - ) +const AppContainer = () => ( + + + +) - if (IS_SPA) createRoot(container).render(AppContainer) - else hydrateRoot(container, AppContainer) -}) +bootstrap() diff --git a/src/client/utils/bootstrap.util.ts b/src/client/utils/bootstrap.util.ts new file mode 100644 index 0000000..9cb7945 --- /dev/null +++ b/src/client/utils/bootstrap.util.ts @@ -0,0 +1,10 @@ +import type { ReactNode } from 'react' +import { loadableReady } from '@loadable/component' +import { createRoot, hydrateRoot } from 'react-dom/client' + +export const bootstrap = (app: ReactNode) => { + const container = document.getElementById('root') as HTMLElement + + if (IS_SPA) createRoot(container).render(app) + else loadableReady(() => hydrateRoot(container, app)) +} diff --git a/src/client/utils/index.ts b/src/client/utils/index.ts index 4111c65..eae3a8e 100644 --- a/src/client/utils/index.ts +++ b/src/client/utils/index.ts @@ -1 +1,2 @@ export * from './lazy.util' +export * from './bootstrap.util' diff --git a/src/server/middleware/render/render.util.ts b/src/server/middleware/render/render.util.ts index 11eee60..7bebcd3 100644 --- a/src/server/middleware/render/render.util.ts +++ b/src/server/middleware/render/render.util.ts @@ -15,7 +15,7 @@ export const getHtml = (reactHtml: string, chunkExtractor: ChunkExtractor) => { SSR app - + ${linkTags} ${styleTags}