import ReactDOM from 'react-dom' ; import { createPlugin } from '@modern-js/runtime-core' ; import { loadableReady } from '@loadable/component' ; import { RenderLevel , SSRServerContext } from './serverRender/type' ; declare module '@modern-js/runtime-core' { interface RuntimeContext { ssrContext ? : any ; } interface TRuntimeContext { request : SSRServerContext [ 'request' ] ; } interface SSRContainer { renderLevel : RenderLevel ; context ? : SSRServerContext ; } } const getQuery = ( ) => window . location . search . substring ( 1 ) . split ( '&' ) . reduce < Record < string , string > > ( ( res , item ) => { const [ key , value ] = item . split ( '=' ) ; res [ key ] = value ; return res ; } , { } ) ; const ssr = ( ) => createPlugin ( ( ) => ( { client : async ( { App , context , rootElement } ) => { const renderLevel = window ?. _SSR_DATA ?. renderLevel ; if ( renderLevel === RenderLevel . CLIENT_RENDER ) { await ( App as any ) ?. prefetch ?. ( context ) ; ReactDOM . render ( < App context = { context } / > , rootElement ) ; } else if ( renderLevel === RenderLevel . SERVER_RENDER ) { loadableReady ( ( ) => { const hydrateContext = { ... context , _hydration : true } ; ReactDOM . hydrate ( < App context = { hydrateContext } / > , rootElement , ( ) => { delete ( hydrateContext as any ) . _hydration ; } ) ; } ) ; } else { ReactDOM . render ( < App context = { context } / > , rootElement ) ; } } , pickContext : ( { context , pickedContext } , next ) => next ( { context , pickedContext : { ... pickedContext , request : { params : { } , pathname : location . pathname , query : getQuery ( ) , headers : { } , cookie : document . cookie , ... ( window ?. _SSR_DATA ?. context ?. request || { } ) , } , } , } ) , } ) , { name : '@modern-js/plugin-ssr' } ) ; export default ssr ; export * from './react' ;