gatsby-plugin-loadable-components-ssr/gatsby-ssr.js

Server-side rendering loadable components in your gatsby application

"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");

exports.__esModule = true;
exports.wrapRootElement = exports.onRenderBody = void 0;

var _server = require("@loadable/server");

var _gatsbyPluginLoadableComponentsSsrStatsFile = _interopRequireDefault(require("gatsby-plugin-loadable-components-ssr-stats-file"));

const extractor = new _server.ChunkExtractor({
  // Read the stats file generated by webpack loadable plugin.
  stats: _gatsbyPluginLoadableComponentsSsrStatsFile.default,
  entrypoints: []
}); // extractor.collectChunks() will wrap the application in a ChunkExtractorManager

const wrapRootElement = ({
  element
}) => {
  return extractor.collectChunks(element);
};

exports.wrapRootElement = wrapRootElement;

const onRenderBody = ({
  setPostBodyComponents,
  setHeadComponents
}, pluginOptions) => {
  // Set link rel="preload" tags in the head to start the request asap. This will NOT parse the assets fetched
  if (pluginOptions.preloadTags) {
    setHeadComponents(extractor.getLinkElements());
  } // Set script and style tags at the end of the document to parse the assets.


  setPostBodyComponents([...extractor.getScriptElements(), ...extractor.getStyleElements()]); // Reset collected chunks after each page is rendered

  extractor.chunks = [];
};

exports.onRenderBody = onRenderBody;