@modern-js/runtime 2.42.1 → 2.43.0

package/dist/cjs/cli/index.js

@@ -32,7 +32,6 @@ __export(cli_exports, {
   runtimePlugin: () => runtimePlugin
 });
 module.exports = __toCommonJS(cli_exports);
-var import_path = __toESM(require("path"));
 var import_utils = require("@modern-js/utils");
 var import_cli = require("../state/cli");
 var import_cli2 = require("../ssr/cli");
@@ -57,8 +56,8 @@ const runtimePlugin = () => ({
   setup: (api) => {
     return {
       config() {
-        const dir = api.useAppContext().internalDirectory || "";
-        process.env.IS_REACT18 = (0, import_utils.isReact18)(import_path.default.join(dir, "../../")).toString();
+        const appDir = api.useAppContext().appDirectory;
+        process.env.IS_REACT18 = (0, import_utils.isReact18)(appDir).toString();
         return {
           runtime: {},
           runtimeByEntries: {},

package/dist/cjs/ssr/cli/index.js

@@ -104,11 +104,11 @@ const ssrPlugin = () => ({
             }
           },
           tools: {
-            bundlerChain(chain, { isServer, isServiceWorker, CHAIN_ID }) {
+            bundlerChain(chain, { isServer, isServiceWorker }) {
               const userConfig = api.useResolvedConfigContext();
               if ((0, import_utils.isUseSSRBundle)(userConfig) && !isServer && !isServiceWorker && checkUseStringSSR(userConfig)) {
                 const LoadableBundlerPlugin = require("./loadable-bundler-plugin.js");
-                chain.plugin(CHAIN_ID.PLUGIN.LOADABLE).use(LoadableBundlerPlugin, [
+                chain.plugin("loadable").use(LoadableBundlerPlugin, [
                   {
                     filename: import_utils.LOADABLE_STATS_FILE
                   }
@@ -154,12 +154,13 @@ const ssrPlugin = () => ({
       },
       modifyEntryRuntimePlugins({ entrypoint, plugins, bundlerConfigs }) {
         if (ssrConfigMap.get(entrypoint.entryName)) {
-          var _bundlerConfigs_find_output, _bundlerConfigs_find, _config_server;
+          var _bundlerConfigs_find_output, _bundlerConfigs_find, _config_server, _config_server1;
           const chunkLoadingGlobal = bundlerConfigs === null || bundlerConfigs === void 0 ? void 0 : (_bundlerConfigs_find = bundlerConfigs.find((config2) => config2.name === "client")) === null || _bundlerConfigs_find === void 0 ? void 0 : (_bundlerConfigs_find_output = _bundlerConfigs_find.output) === null || _bundlerConfigs_find_output === void 0 ? void 0 : _bundlerConfigs_find_output.chunkLoadingGlobal;
           const config = api.useResolvedConfigContext();
           const { enableInlineScripts, enableInlineStyles } = config.output;
           const { crossorigin, scriptLoading } = config.html;
           const disablePrerender = typeof ((_config_server = config.server) === null || _config_server === void 0 ? void 0 : _config_server.ssr) === "object" ? Boolean(config.server.ssr.disablePrerender) : false;
+          const unsafeHeaders = typeof ((_config_server1 = config.server) === null || _config_server1 === void 0 ? void 0 : _config_server1.ssr) === "object" ? config.server.ssr.unsafeHeaders : void 0;
           plugins.push({
             name: PLUGIN_IDENTIFIER,
             options: JSON.stringify({
@@ -169,7 +170,8 @@ const ssrPlugin = () => ({
               chunkLoadingGlobal,
               disablePrerender,
               enableInlineScripts: typeof enableInlineScripts === "function" ? void 0 : enableInlineScripts,
-              enableInlineStyles: typeof enableInlineStyles === "function" ? void 0 : enableInlineStyles
+              enableInlineStyles: typeof enableInlineStyles === "function" ? void 0 : enableInlineStyles,
+              unsafeHeaders
             })
           });
         }

package/dist/cjs/ssr/index.js

@@ -40,15 +40,15 @@ var import_parsed = require("@modern-js/runtime-utils/parsed");
 var import_types = require("./serverRender/types");
 var import_withCallback = require("./react/withCallback");
 var import_utils = require("./utils");
-var import_utils2 = require("./serverRender/utils");
+var import_constants = require("./serverRender/constants");
 __reExport(ssr_exports, require("./react"), module.exports);
 const ssr = (config) => ({
   name: "@modern-js/plugin-ssr",
   setup: () => {
     const mockResp = (0, import_utils.mockResponse)();
     if (config.inlineScript === false) {
-      window._SSR_DATA = (0, import_parsed.parsedJSONFromElement)(import_utils2.SSR_DATA_JSON_ID);
-      window._ROUTER_DATA = (0, import_parsed.parsedJSONFromElement)(import_utils2.ROUTER_DATA_JSON_ID);
+      window._SSR_DATA = (0, import_parsed.parsedJSONFromElement)(import_constants.SSR_DATA_JSON_ID);
+      window._ROUTER_DATA = (0, import_parsed.parsedJSONFromElement)(import_constants.ROUTER_DATA_JSON_ID);
     }
     return {
       client: async ({ App, context, ModernRender, ModernHydrate }) => {
@@ -60,6 +60,14 @@ const ssr = (config) => ({
           },
           _hydration: true
         };
+        const { ssrContext } = hydrateContext;
+        const { pathname: initialPathname } = ssrContext.request;
+        const currentPathname = window.location.pathname;
+        if (initialPathname !== currentPathname) {
+          const errorMsg = `The initial URL ${initialPathname} and the URL ${currentPathname} to be hydrated do not match, reload.`;
+          console.error(errorMsg);
+          window.location.reload();
+        }
         const callback = () => {
           delete hydrateContext._hydration;
         };

package/dist/cjs/ssr/react/prerender/index.js

@@ -101,6 +101,7 @@ function factory(Component) {
       if (!validate) {
         throw new Error("invalid props, check usage");
       }
+      console.error("[Warn] PreRender has been deprecated, please use SSR Cache instead. reference to docs: https://modernjs.dev/guides/advanced-features/ssr.html");
       return (0, import_react.createElement)(Component, {
         ...newProps
       });

package/dist/cjs/ssr/serverRender/{renderToString/type.js → constants.js}

@@ -16,18 +16,28 @@ var __copyProps = (to, from, except, desc) => {
   return to;
 };
 var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
-var type_exports = {};
-__export(type_exports, {
-  RenderLevel: () => RenderLevel
+var constants_exports = {};
+__export(constants_exports, {
+  CHUNK_CSS_PLACEHOLDER: () => CHUNK_CSS_PLACEHOLDER,
+  CHUNK_JS_PLACEHOLDER: () => CHUNK_JS_PLACEHOLDER,
+  HTML_PLACEHOLDER: () => HTML_PLACEHOLDER,
+  ROUTER_DATA_JSON_ID: () => ROUTER_DATA_JSON_ID,
+  SSR_DATA_JSON_ID: () => SSR_DATA_JSON_ID,
+  SSR_DATA_PLACEHOLDER: () => SSR_DATA_PLACEHOLDER
 });
-module.exports = __toCommonJS(type_exports);
-var RenderLevel;
-(function(RenderLevel2) {
-  RenderLevel2[RenderLevel2["CLIENT_RENDER"] = 0] = "CLIENT_RENDER";
-  RenderLevel2[RenderLevel2["SERVER_PREFETCH"] = 1] = "SERVER_PREFETCH";
-  RenderLevel2[RenderLevel2["SERVER_RENDER"] = 2] = "SERVER_RENDER";
-})(RenderLevel || (RenderLevel = {}));
+module.exports = __toCommonJS(constants_exports);
+const HTML_PLACEHOLDER = "<!--<?- html ?>-->";
+const SSR_DATA_PLACEHOLDER = "<!--<?- SSRDataScript ?>-->";
+const CHUNK_JS_PLACEHOLDER = "<!--<?- chunksMap.js ?>-->";
+const CHUNK_CSS_PLACEHOLDER = "<!--<?- chunksMap.css ?>-->";
+const SSR_DATA_JSON_ID = "__MODERN_SSR_DATA__";
+const ROUTER_DATA_JSON_ID = "__MODERN_ROUTER_DATA__";
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
-  RenderLevel
+  CHUNK_CSS_PLACEHOLDER,
+  CHUNK_JS_PLACEHOLDER,
+  HTML_PLACEHOLDER,
+  ROUTER_DATA_JSON_ID,
+  SSR_DATA_JSON_ID,
+  SSR_DATA_PLACEHOLDER
 });

package/dist/cjs/ssr/serverRender/helmet.js

@@ -22,6 +22,7 @@ __export(helmet_exports, {
 });
 module.exports = __toCommonJS(helmet_exports);
 var import_os = require("os");
+var import_utils = require("./utils");
 const RE_HTML_ATTR = /<html[^>]*>/;
 const RE_BODY_ATTR = /<body[^>]*>/;
 const RE_LAST_IN_HEAD = /<\/head>/;
@@ -31,11 +32,11 @@ function helmet(content, helmetData) {
   let result = content;
   const bodyAttributes = helmetData.bodyAttributes.toString();
   if (bodyAttributes) {
-    result = result.replace(RE_BODY_ATTR, `<body ${bodyAttributes}>`);
+    result = (0, import_utils.safeReplace)(result, RE_BODY_ATTR, `<body ${bodyAttributes}>`);
   }
   const htmlAttributes = helmetData.htmlAttributes.toString();
   if (htmlAttributes) {
-    result = result.replace(RE_HTML_ATTR, `<html ${htmlAttributes}>`);
+    result = (0, import_utils.safeReplace)(result, RE_HTML_ATTR, `<html ${htmlAttributes}>`);
   }
   const base = helmetData.base.toString();
   const link = helmetData.link.toString();
@@ -47,7 +48,7 @@ function helmet(content, helmetData) {
   const existTitleTag = RE_TITLE.test(content);
   const shouldReplaceTitle = existTitleTag && TEST_TITLE_CONTENT.test(title.trim());
   if (shouldReplaceTitle) {
-    result = result.replace(RE_TITLE, title);
+    result = (0, import_utils.safeReplace)(result, RE_TITLE, title);
   }
   const helmetStr = [
     base,
@@ -60,5 +61,5 @@ function helmet(content, helmetData) {
   ].reduce((pre, cur) => {
     return pre + (cur.length > 0 ? `  ${cur}${import_os.EOL}` : "");
   }, "");
-  return result.replace(RE_LAST_IN_HEAD, `${helmetStr}</head>`);
+  return (0, import_utils.safeReplace)(result, RE_LAST_IN_HEAD, `${helmetStr}</head>`);
 }

package/dist/cjs/ssr/serverRender/index.js

@@ -22,12 +22,12 @@ __export(serverRender_exports, {
 });
 module.exports = __toCommonJS(serverRender_exports);
 var import_utils = require("../utils");
-var import_utils2 = require("./utils");
+var import_constants = require("./constants");
 async function serverRender(options) {
   var _options_context_ssrContext;
   if ((_options_context_ssrContext = options.context.ssrContext) === null || _options_context_ssrContext === void 0 ? void 0 : _options_context_ssrContext.template) {
     var _options_context_ssrContext1;
-    options.context.ssrContext.template = (_options_context_ssrContext1 = options.context.ssrContext) === null || _options_context_ssrContext1 === void 0 ? void 0 : _options_context_ssrContext1.template.replace("</head>", `${import_utils2.CSS_CHUNKS_PLACEHOLDER}</head>`);
+    options.context.ssrContext.template = (_options_context_ssrContext1 = options.context.ssrContext) === null || _options_context_ssrContext1 === void 0 ? void 0 : _options_context_ssrContext1.template.replace("</head>", `${import_constants.CHUNK_CSS_PLACEHOLDER}</head>`);
   }
   if ((0, import_utils.isReact18)() && options.config.mode === "stream") {
     const pipe = await require("./renderToStream").render(options);

package/dist/cjs/ssr/serverRender/renderToStream/buildTemplate.after.js

@@ -23,6 +23,7 @@ __export(buildTemplate_after_exports, {
 module.exports = __toCommonJS(buildTemplate_after_exports);
 var import_node = require("@modern-js/runtime-utils/node");
 var import_utils = require("../utils");
+var import_constants = require("../constants");
 var import_buildTemplate = require("./buildTemplate.share");
 function buildShellAfterTemplate(afterAppTemplate, options) {
   const callbacks = [
@@ -31,7 +32,7 @@ function buildShellAfterTemplate(afterAppTemplate, options) {
   return (0, import_buildTemplate.buildTemplate)(afterAppTemplate, callbacks);
   function injectSSRDataScript(template) {
     const ssrDataScript = buildSSRDataScript();
-    return template.replace("<!--<?- SSRDataScript ?>-->", ssrDataScript);
+    return (0, import_utils.safeReplace)(template, import_constants.SSR_DATA_PLACEHOLDER, ssrDataScript);
     function buildSSRDataScript() {
       const { context: { ssrContext, initialData, __i18nData__ }, renderLevel } = options;
       const { request, enableUnsafeCtx, nonce, tracker } = ssrContext;

package/dist/cjs/ssr/serverRender/renderToStream/bulidTemplate.before.js

@@ -34,6 +34,7 @@ module.exports = __toCommonJS(bulidTemplate_before_exports);
 var import_react_helmet = __toESM(require("react-helmet"));
 var import_router = require("@modern-js/runtime-utils/router");
 var import_helmet = __toESM(require("../helmet"));
+var import_constants = require("../constants");
 var import_utils = require("../utils");
 var import_buildTemplate = require("./buildTemplate.share");
 function getHeadTemplate(beforeEntryTemplate, context) {
@@ -51,7 +52,7 @@ function getHeadTemplate(beforeEntryTemplate, context) {
   }
   return (0, import_buildTemplate.buildTemplate)(headTemplate, callbacks);
   function injectCss(headTemplate2) {
-    return headTemplate2.replace(import_utils.CSS_CHUNKS_PLACEHOLDER, getCssChunks());
+    return (0, import_utils.safeReplace)(headTemplate2, import_constants.CHUNK_CSS_PLACEHOLDER, getCssChunks());
     function getCssChunks() {
       const { routeManifest, routerContext, routes } = context;
       if (!routeManifest || !routerContext || !routes) {

package/dist/cjs/ssr/serverRender/renderToStream/index.js

@@ -34,7 +34,6 @@ module.exports = __toCommonJS(renderToStream_exports);
 var import_react = require("react");
 var import_node = require("@modern-js/runtime-utils/node");
 var import_time = require("@modern-js/runtime-utils/time");
-var import_prerender = require("../../react/prerender");
 var import_tracker = require("../tracker");
 var import_renderToPipe = __toESM(require("./renderToPipe"));
 const render = ({ App, context }) => {
@@ -52,10 +51,6 @@ const render = ({ App, context }) => {
     const { tracker } = ssrContext;
     const pipe = (0, import_renderToPipe.default)(rootElement, context, {
       onShellReady() {
-        const cacheConfig = import_prerender.PreRender.config();
-        if (cacheConfig) {
-          ssrContext.cacheConfig = cacheConfig;
-        }
         const cost = end();
         tracker.trackTiming(import_tracker.SSRTimings.RENDER_SHELL, cost);
       },

package/dist/cjs/ssr/serverRender/renderToString/buildHtml.js

@@ -25,24 +25,22 @@ __export(buildHtml_exports, {
   createReplaceSSRDataScript: () => createReplaceSSRDataScript
 });
 module.exports = __toCommonJS(buildHtml_exports);
+var import_utils = require("../utils");
+var import_constants = require("../constants");
 function buildHtml(template, callbacks) {
   return callbacks.reduce((tmp, cb) => cb(tmp), template);
 }
 function createReplaceHtml(html) {
-  const HTML_REG = /<!--<\?-\s*html\s*\?>-->/;
-  return (template) => template.replace(HTML_REG, html);
+  return (template) => (0, import_utils.safeReplace)(template, import_constants.HTML_PLACEHOLDER, html);
 }
 function createReplaceSSRDataScript(data) {
-  const SSR_DATA_REG = /<!--<\?-\s*SSRDataScript\s*\?>-->/;
-  return (template) => template.replace(SSR_DATA_REG, data);
+  return (template) => (0, import_utils.safeReplace)(template, import_constants.SSR_DATA_PLACEHOLDER, data);
 }
 function createReplaceChunkJs(js) {
-  const CHUNK_JS_REG = /<!--<\?-\s*chunksMap\.js\s*\?>-->/;
-  return (template) => template.replace(CHUNK_JS_REG, js);
+  return (template) => (0, import_utils.safeReplace)(template, import_constants.CHUNK_JS_PLACEHOLDER, js);
 }
 function createReplaceChunkCss(css) {
-  const CHUNK_CSS_REG = /<!--<\?-\s*chunksMap\.css\s*\?>-->/;
-  return (template) => template.replace(CHUNK_CSS_REG, css);
+  return (template) => (0, import_utils.safeReplace)(template, import_constants.CHUNK_CSS_PLACEHOLDER, css);
 }
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {

package/dist/cjs/ssr/serverRender/renderToString/entry.js

@@ -40,17 +40,20 @@ var import_utils = require("../../../router/runtime/utils");
 var import_helmet = __toESM(require("../helmet"));
 var import_types = require("../types");
 var import_prefetch = __toESM(require("../../prefetch"));
+var import_constants = require("../constants");
 var import_utils2 = require("../utils");
 var import_tracker = require("../tracker");
 var import_loadable = require("./loadable");
 var import_render = require("./render");
 var import_styledComponent = require("./styledComponent");
 var import_buildHtml = require("./buildHtml");
-const buildTemplateData = (context, data, renderLevel, tracker) => {
-  const { request, enableUnsafeCtx } = context;
-  const unsafeContext = {
-    headers: request.headers
-  };
+const buildTemplateData = (context, data, renderLevel, tracker, config) => {
+  const { request } = context;
+  const { unsafeHeaders } = config;
+  const headers = unsafeHeaders ? Object.fromEntries(Object.entries(request.headers).filter(([key, _]) => {
+    var _unsafeHeaders_map;
+    return unsafeHeaders === null || unsafeHeaders === void 0 ? void 0 : (_unsafeHeaders_map = unsafeHeaders.map((header) => header.toLowerCase())) === null || _unsafeHeaders_map === void 0 ? void 0 : _unsafeHeaders_map.includes(key.toLowerCase());
+  })) : void 0;
   return {
     data,
     context: {
@@ -60,7 +63,7 @@ const buildTemplateData = (context, data, renderLevel, tracker) => {
         pathname: request.pathname,
         host: request.host,
         url: request.url,
-        ...enableUnsafeCtx ? unsafeContext : {}
+        headers
       },
       reporter: {
         sessionId: tracker.sessionId
@@ -69,8 +72,7 @@ const buildTemplateData = (context, data, renderLevel, tracker) => {
     renderLevel
   };
 };
-var Entry;
-Entry = class Entry2 {
+class Entry {
   async renderToHtml(context) {
     var _ssrContext_redirection, _ssrContext_redirection1, _ssrContext_redirection2;
     const ssrContext = context.ssrContext;
@@ -92,13 +94,13 @@ Entry = class Entry2 {
       loaderData: routerContext.loaderData,
       errors: (0, import_utils.serializeErrors)(routerContext.errors)
     } : void 0;
-    const templateData = buildTemplateData(ssrContext, prefetchData, this.result.renderLevel, this.tracker);
+    const templateData = buildTemplateData(ssrContext, prefetchData, this.result.renderLevel, this.tracker, this.pluginConfig);
     const ssrDataScripts = this.getSSRDataScript(templateData, routerData);
     const html = (0, import_buildHtml.buildHtml)(this.template, [
       (0, import_buildHtml.createReplaceChunkCss)(this.result.chunksMap.css),
       (0, import_buildHtml.createReplaceChunkJs)(this.result.chunksMap.js),
-      (0, import_buildHtml.createReplaceHtml)(this.result.html || ""),
       (0, import_buildHtml.createReplaceSSRDataScript)(ssrDataScripts),
+      (0, import_buildHtml.createReplaceHtml)(this.result.html || ""),
       ...this.htmlModifiers
     ]);
     const helmetData = import_react_helmet.default.renderStatic();
@@ -147,12 +149,12 @@ Entry = class Entry2 {
     const attrsStr = (0, import_utils2.attributesToString)({
       nonce: this.nonce
     });
-    let ssrDataScripts = useInlineScript ? `<script${attrsStr}>window._SSR_DATA = ${ssrData}</script>` : `<script type="application/json" id="${import_utils2.SSR_DATA_JSON_ID}">${ssrData}</script>`;
+    let ssrDataScripts = useInlineScript ? `<script${attrsStr}>window._SSR_DATA = ${ssrData}</script>` : `<script type="application/json" id="${import_constants.SSR_DATA_JSON_ID}">${ssrData}</script>`;
     if (routerData) {
       const serializedRouterData = (0, import_node.serializeJson)(routerData);
       ssrDataScripts += useInlineScript ? `
 <script${attrsStr}>window._ROUTER_DATA = ${serializedRouterData}</script>` : `
-<script type="application/json" id="${import_utils2.ROUTER_DATA_JSON_ID}">${serializedRouterData}</script>`;
+<script type="application/json" id="${import_constants.ROUTER_DATA_JSON_ID}">${serializedRouterData}</script>`;
     }
     return ssrDataScripts;
   }
@@ -187,4 +189,4 @@ Entry = class Entry2 {
       }
     };
   }
-};
+}

package/dist/cjs/ssr/serverRender/renderToString/index.js

@@ -32,7 +32,6 @@ __export(renderToString_exports, {
 });
 module.exports = __toCommonJS(renderToString_exports);
 var import_node = require("@modern-js/runtime-utils/node");
-var import_prerender = require("../../react/prerender");
 var import_entry = __toESM(require("./entry"));
 const render = ({ App, context, config }) => {
   const ssrContext = context.ssrContext;
@@ -44,10 +43,6 @@ const render = ({ App, context, config }) => {
     });
     entry.metrics.emitCounter("app.visit.count", 1);
     const html = await entry.renderToHtml(context);
-    const cacheConfig = import_prerender.PreRender.config();
-    if (cacheConfig) {
-      context.ssrContext.cacheConfig = cacheConfig;
-    }
     return html;
   });
 };

package/dist/cjs/ssr/serverRender/types.js

@@ -18,10 +18,15 @@ var __copyProps = (to, from, except, desc) => {
 var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
 var types_exports = {};
 __export(types_exports, {
-  RenderLevel: () => import_type.RenderLevel
+  RenderLevel: () => RenderLevel
 });
 module.exports = __toCommonJS(types_exports);
-var import_type = require("./renderToString/type");
+var RenderLevel;
+(function(RenderLevel2) {
+  RenderLevel2[RenderLevel2["CLIENT_RENDER"] = 0] = "CLIENT_RENDER";
+  RenderLevel2[RenderLevel2["SERVER_PREFETCH"] = 1] = "SERVER_PREFETCH";
+  RenderLevel2[RenderLevel2["SERVER_RENDER"] = 2] = "SERVER_RENDER";
+})(RenderLevel || (RenderLevel = {}));
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
   RenderLevel

package/dist/cjs/ssr/serverRender/utils.js

@@ -18,24 +18,20 @@ var __copyProps = (to, from, except, desc) => {
 var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
 var utils_exports = {};
 __export(utils_exports, {
-  CSS_CHUNKS_PLACEHOLDER: () => CSS_CHUNKS_PLACEHOLDER,
-  ROUTER_DATA_JSON_ID: () => ROUTER_DATA_JSON_ID,
-  SSR_DATA_JSON_ID: () => SSR_DATA_JSON_ID,
-  attributesToString: () => attributesToString
+  attributesToString: () => attributesToString,
+  safeReplace: () => safeReplace
 });
 module.exports = __toCommonJS(utils_exports);
-const CSS_CHUNKS_PLACEHOLDER = "<!--<?- chunksMap.css ?>-->";
-const SSR_DATA_JSON_ID = "__MODERN_SSR_DATA__";
-const ROUTER_DATA_JSON_ID = "__MODERN_ROUTER_DATA__";
 function attributesToString(attributes) {
   return Object.entries(attributes).reduce((str, [key, value]) => {
     return value === void 0 ? str : `${str} ${key}="${value}"`;
   }, "");
 }
+function safeReplace(source, searchValue, replaceValue) {
+  return source.replace(searchValue, () => replaceValue);
+}
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
-  CSS_CHUNKS_PLACEHOLDER,
-  ROUTER_DATA_JSON_ID,
-  SSR_DATA_JSON_ID,
-  attributesToString
+  attributesToString,
+  safeReplace
 });

package/dist/esm/cli/index.js

@@ -1,6 +1,5 @@
 import { _ as _async_to_generator } from "@swc/helpers/_/_async_to_generator";
 import { _ as _ts_generator } from "@swc/helpers/_/_ts_generator";
-import path from "path";
 import { isReact18, cleanRequireCache } from "@modern-js/utils";
 import { statePlugin } from "../state/cli";
 import { ssrPlugin } from "../ssr/cli";
@@ -26,8 +25,8 @@ var runtimePlugin = function() {
     setup: function(api) {
       return {
         config: function config() {
-          var dir = api.useAppContext().internalDirectory || "";
-          process.env.IS_REACT18 = isReact18(path.join(dir, "../../")).toString();
+          var appDir = api.useAppContext().appDirectory;
+          process.env.IS_REACT18 = isReact18(appDir).toString();
           return {
             runtime: {},
             runtimeByEntries: {},

package/dist/esm/ssr/cli/index.js

@@ -94,11 +94,11 @@ var ssrPlugin = function() {
             },
             tools: {
               bundlerChain: function bundlerChain(chain, param) {
-                var isServer = param.isServer, isServiceWorker = param.isServiceWorker, CHAIN_ID = param.CHAIN_ID;
+                var isServer = param.isServer, isServiceWorker = param.isServiceWorker;
                 var userConfig = api.useResolvedConfigContext();
                 if (isUseSSRBundle(userConfig) && !isServer && !isServiceWorker && checkUseStringSSR(userConfig)) {
                   var LoadableBundlerPlugin = require("./loadable-bundler-plugin.js");
-                  chain.plugin(CHAIN_ID.PLUGIN.LOADABLE).use(LoadableBundlerPlugin, [
+                  chain.plugin("loadable").use(LoadableBundlerPlugin, [
                     {
                       filename: LOADABLE_STATS_FILE
                     }
@@ -146,7 +146,7 @@ var ssrPlugin = function() {
         modifyEntryRuntimePlugins: function modifyEntryRuntimePlugins(param) {
           var entrypoint = param.entrypoint, plugins = param.plugins, bundlerConfigs = param.bundlerConfigs;
           if (ssrConfigMap.get(entrypoint.entryName)) {
-            var _bundlerConfigs_find_output, _bundlerConfigs_find, _config_server;
+            var _bundlerConfigs_find_output, _bundlerConfigs_find, _config_server, _config_server1;
             var chunkLoadingGlobal = bundlerConfigs === null || bundlerConfigs === void 0 ? void 0 : (_bundlerConfigs_find = bundlerConfigs.find(function(config2) {
               return config2.name === "client";
             })) === null || _bundlerConfigs_find === void 0 ? void 0 : (_bundlerConfigs_find_output = _bundlerConfigs_find.output) === null || _bundlerConfigs_find_output === void 0 ? void 0 : _bundlerConfigs_find_output.chunkLoadingGlobal;
@@ -154,6 +154,7 @@ var ssrPlugin = function() {
             var _config_output = config.output, enableInlineScripts = _config_output.enableInlineScripts, enableInlineStyles = _config_output.enableInlineStyles;
             var _config_html = config.html, crossorigin = _config_html.crossorigin, scriptLoading = _config_html.scriptLoading;
             var disablePrerender = typeof ((_config_server = config.server) === null || _config_server === void 0 ? void 0 : _config_server.ssr) === "object" ? Boolean(config.server.ssr.disablePrerender) : false;
+            var unsafeHeaders = typeof ((_config_server1 = config.server) === null || _config_server1 === void 0 ? void 0 : _config_server1.ssr) === "object" ? config.server.ssr.unsafeHeaders : void 0;
             plugins.push({
               name: PLUGIN_IDENTIFIER,
               options: JSON.stringify(_object_spread_props(_object_spread({}, ssrConfigMap.get(entrypoint.entryName) || {}), {
@@ -162,7 +163,8 @@ var ssrPlugin = function() {
                 chunkLoadingGlobal,
                 disablePrerender,
                 enableInlineScripts: typeof enableInlineScripts === "function" ? void 0 : enableInlineScripts,
-                enableInlineStyles: typeof enableInlineStyles === "function" ? void 0 : enableInlineStyles
+                enableInlineStyles: typeof enableInlineStyles === "function" ? void 0 : enableInlineStyles,
+                unsafeHeaders
               }))
             });
           }

package/dist/esm/ssr/index.js

@@ -9,7 +9,7 @@ import { parsedJSONFromElement } from "@modern-js/runtime-utils/parsed";
 import { RenderLevel } from "./serverRender/types";
 import { WithCallback } from "./react/withCallback";
 import { formatClient, mockResponse, isReact18 } from "./utils";
-import { ROUTER_DATA_JSON_ID, SSR_DATA_JSON_ID } from "./serverRender/utils";
+import { ROUTER_DATA_JSON_ID, SSR_DATA_JSON_ID } from "./serverRender/constants";
 var ssr = function(config) {
   return {
     name: "@modern-js/plugin-ssr",
@@ -22,7 +22,7 @@ var ssr = function(config) {
       return {
         client: function() {
           var _ref = _async_to_generator(function(param) {
-            var App, context, ModernRender, ModernHydrate, _window__SSR_DATA, _window, hydrateContext, callback, renderLevel;
+            var App, context, ModernRender, ModernHydrate, _window__SSR_DATA, _window, hydrateContext, ssrContext, _ssrContext_request, initialPathname, currentPathname, errorMsg, callback, renderLevel;
             function stringSSRHydrate() {
               if (renderLevel === RenderLevel.CLIENT_RENDER || renderLevel === RenderLevel.SERVER_PREFETCH) {
                 ModernRender(/* @__PURE__ */ _jsx(App, {
@@ -85,6 +85,14 @@ var ssr = function(config) {
                 },
                 _hydration: true
               });
+              ssrContext = hydrateContext.ssrContext;
+              _ssrContext_request = ssrContext.request, initialPathname = _ssrContext_request.pathname;
+              currentPathname = window.location.pathname;
+              if (initialPathname !== currentPathname) {
+                errorMsg = "The initial URL ".concat(initialPathname, " and the URL ").concat(currentPathname, " to be hydrated do not match, reload.");
+                console.error(errorMsg);
+                window.location.reload();
+              }
               callback = function() {
                 delete hydrateContext._hydration;
               };

package/dist/esm/ssr/react/prerender/index.js

@@ -76,6 +76,7 @@ function factory(Component) {
           if (!validate) {
             throw new Error("invalid props, check usage");
           }
+          console.error("[Warn] PreRender has been deprecated, please use SSR Cache instead. reference to docs: https://modernjs.dev/guides/advanced-features/ssr.html");
           return createElement(Component, _object_spread({}, newProps));
         }
       }

package/dist/esm/ssr/serverRender/constants.js

@@ -0,0 +1,14 @@
+var HTML_PLACEHOLDER = "<!--<?- html ?>-->";
+var SSR_DATA_PLACEHOLDER = "<!--<?- SSRDataScript ?>-->";
+var CHUNK_JS_PLACEHOLDER = "<!--<?- chunksMap.js ?>-->";
+var CHUNK_CSS_PLACEHOLDER = "<!--<?- chunksMap.css ?>-->";
+var SSR_DATA_JSON_ID = "__MODERN_SSR_DATA__";
+var ROUTER_DATA_JSON_ID = "__MODERN_ROUTER_DATA__";
+export {
+  CHUNK_CSS_PLACEHOLDER,
+  CHUNK_JS_PLACEHOLDER,
+  HTML_PLACEHOLDER,
+  ROUTER_DATA_JSON_ID,
+  SSR_DATA_JSON_ID,
+  SSR_DATA_PLACEHOLDER
+};

package/dist/esm/ssr/serverRender/helmet.js

@@ -1,4 +1,5 @@
 import { EOL } from "os";
+import { safeReplace } from "./utils";
 var RE_HTML_ATTR = /<html[^>]*>/;
 var RE_BODY_ATTR = /<body[^>]*>/;
 var RE_LAST_IN_HEAD = /<\/head>/;
@@ -8,11 +9,11 @@ function helmet(content, helmetData) {
   var result = content;
   var bodyAttributes = helmetData.bodyAttributes.toString();
   if (bodyAttributes) {
-    result = result.replace(RE_BODY_ATTR, "<body ".concat(bodyAttributes, ">"));
+    result = safeReplace(result, RE_BODY_ATTR, "<body ".concat(bodyAttributes, ">"));
   }
   var htmlAttributes = helmetData.htmlAttributes.toString();
   if (htmlAttributes) {
-    result = result.replace(RE_HTML_ATTR, "<html ".concat(htmlAttributes, ">"));
+    result = safeReplace(result, RE_HTML_ATTR, "<html ".concat(htmlAttributes, ">"));
   }
   var base = helmetData.base.toString();
   var link = helmetData.link.toString();
@@ -24,7 +25,7 @@ function helmet(content, helmetData) {
   var existTitleTag = RE_TITLE.test(content);
   var shouldReplaceTitle = existTitleTag && TEST_TITLE_CONTENT.test(title.trim());
   if (shouldReplaceTitle) {
-    result = result.replace(RE_TITLE, title);
+    result = safeReplace(result, RE_TITLE, title);
   }
   var helmetStr = [
     base,
@@ -37,7 +38,7 @@ function helmet(content, helmetData) {
   ].reduce(function(pre, cur) {
     return pre + (cur.length > 0 ? "  ".concat(cur).concat(EOL) : "");
   }, "");
-  return result.replace(RE_LAST_IN_HEAD, "".concat(helmetStr, "</head>"));
+  return safeReplace(result, RE_LAST_IN_HEAD, "".concat(helmetStr, "</head>"));
 }
 export {
   helmet as default

package/dist/esm/ssr/serverRender/index.js

@@ -1,7 +1,7 @@
 import { _ as _async_to_generator } from "@swc/helpers/_/_async_to_generator";
 import { _ as _ts_generator } from "@swc/helpers/_/_ts_generator";
 import { isReact18 } from "../utils";
-import { CSS_CHUNKS_PLACEHOLDER } from "./utils";
+import { CHUNK_CSS_PLACEHOLDER } from "./constants";
 function serverRender(options) {
   return _serverRender.apply(this, arguments);
 }
@@ -13,7 +13,7 @@ function _serverRender() {
         case 0:
           if ((_options_context_ssrContext = options.context.ssrContext) === null || _options_context_ssrContext === void 0 ? void 0 : _options_context_ssrContext.template) {
             ;
-            options.context.ssrContext.template = (_options_context_ssrContext1 = options.context.ssrContext) === null || _options_context_ssrContext1 === void 0 ? void 0 : _options_context_ssrContext1.template.replace("</head>", "".concat(CSS_CHUNKS_PLACEHOLDER, "</head>"));
+            options.context.ssrContext.template = (_options_context_ssrContext1 = options.context.ssrContext) === null || _options_context_ssrContext1 === void 0 ? void 0 : _options_context_ssrContext1.template.replace("</head>", "".concat(CHUNK_CSS_PLACEHOLDER, "</head>"));
           }
           if (!(isReact18() && options.config.mode === "stream"))
             return [

package/dist/esm/ssr/serverRender/renderToStream/buildTemplate.after.js

@@ -1,6 +1,7 @@
 import { _ as _object_spread } from "@swc/helpers/_/_object_spread";
 import { serializeJson } from "@modern-js/runtime-utils/node";
-import { attributesToString } from "../utils";
+import { attributesToString, safeReplace } from "../utils";
+import { SSR_DATA_PLACEHOLDER } from "../constants";
 import { buildTemplate } from "./buildTemplate.share";
 function buildShellAfterTemplate(afterAppTemplate, options) {
   var callbacks = [
@@ -9,7 +10,7 @@ function buildShellAfterTemplate(afterAppTemplate, options) {
   return buildTemplate(afterAppTemplate, callbacks);
   function injectSSRDataScript(template) {
     var ssrDataScript = buildSSRDataScript();
-    return template.replace("<!--<?- SSRDataScript ?>-->", ssrDataScript);
+    return safeReplace(template, SSR_DATA_PLACEHOLDER, ssrDataScript);
     function buildSSRDataScript() {
       var _options_context = options.context, ssrContext = _options_context.ssrContext, initialData = _options_context.initialData, __i18nData__ = _options_context.__i18nData__, renderLevel = options.renderLevel;
       var request = ssrContext.request, enableUnsafeCtx = ssrContext.enableUnsafeCtx, nonce = ssrContext.nonce, tracker = ssrContext.tracker;