SSRLoadable.js

Loadable.preloadAll()
  .then(() =>
    onPageLoad(async sink => {
      try {
        const cache = new InMemoryCache();
        const stateLink = withClientState({
          cache,
          resolvers: stateMutations,
          defaults: defaultState,
        });
        const schemaLink = new SchemaLink({ schema });
        const link = from([stateLink, schemaLink]);
        const client = new ApolloClient({
          ssrMode: true,
          link,
          cache,
        });

        const context = {};
        const modulesResolved = [];
        const modules = [];
        const ServerApp = (
          <Loadable.Capture
            report={moduleName => {
              modules.push(moduleName);
            }}
            reportResolved={resolvedModuleName => {
              modulesResolved.push(resolvedModuleName);
            }}
          >
            <ApolloProvider client={client}>
              <StaticRouter location={sink.request.url} context={context}>
                <App />
              </StaticRouter>
            </ApolloProvider>
          </Loadable.Capture>
        );

        const content = await renderToStringWithData(ServerApp);

        // Loads Meta
        const meta = Helmet.renderStatic();
        sink.appendToHead(meta.title.toString());

        // Loads styles
        const sheet = new ServerStyleSheet();
        sink.appendToHead(sheet.getStyleTags());

        // const body = renderToNodeStream(<ServerApp />);
        sink.renderIntoElementById('app', content);

        sink.appendToBody(
          `<script> var __preloadables__ = ${JSON.stringify(
            modulesResolved
          )}; </script>`
        );
        sink.appendToBody(`
          <script>
            window.__APOLLO_STATE__=${JSON.stringify(client.extract())};
          </script>
        `);
      } catch (e) {
        console.log(e.message);
      }
    })
  )
  .catch(error => {
    console.log(error);
  });