@modern-js/runtime 3.4.0 → 3.6.0

package/dist/cjs/cli/index.js

@@ -101,12 +101,10 @@ const runtimePlugin = (params)=>({
             });
             api.config(()=>{
                 const { appDirectory, metaName } = api.getAppContext();
-                const isReact18 = (0, utils_namespaceObject.isReact18)(appDirectory);
-                process.env.IS_REACT18 = isReact18.toString();
                 return {
                     source: {
                         globalVars: {
-                            'process.env.IS_REACT18': process.env.IS_REACT18
+                            'process.env.IS_REACT18': 'true'
                         },
                         include: [
                             new RegExp(`[\\\\/]node_modules[\\\\/]@${metaName}[\\\\/]runtime[\\\\/].*[\\\\/]head\\.`)
@@ -115,14 +113,6 @@ const runtimePlugin = (params)=>({
                     tools: {
                         bundlerChain: (chain)=>{
                             chain.module.rule('modern-entry').test(/\.jsx?$/).include.add(external_path_default().resolve(appDirectory, 'node_modules', `.${metaName}`)).end().sideEffects(true);
-                        },
-                        rspack: (_config, { appendPlugins, rspack })=>{
-                            if (!isReact18) appendPlugins([
-                                new rspack.IgnorePlugin({
-                                    resourceRegExp: /^react-dom\/client$/,
-                                    contextRegExp: /@modern-js\/runtime/
-                                })
-                            ]);
                         }
                     }
                 };

package/dist/cjs/core/browser/hydrate.js

@@ -28,15 +28,13 @@ var __webpack_require__ = {};
 var __webpack_exports__ = {};
 __webpack_require__.r(__webpack_exports__);
 __webpack_require__.d(__webpack_exports__, {
-    hydrateRoot: ()=>hydrateRoot,
-    isReact18: ()=>isReact18
+    hydrateRoot: ()=>hydrateRoot
 });
 const jsx_runtime_namespaceObject = require("react/jsx-runtime");
 const component_namespaceObject = require("@loadable/component");
 const external_constants_js_namespaceObject = require("../constants.js");
 const wrapper_js_namespaceObject = require("../react/wrapper.js");
 const external_withCallback_js_namespaceObject = require("./withCallback.js");
-const isReact18 = ()=>'true' === process.env.IS_REACT18;
 function hydrateRoot(App, context, ModernRender, ModernHydrate) {
     const hydrateContext = {
         ...context,
@@ -50,7 +48,7 @@ function hydrateRoot(App, context, ModernRender, ModernHydrate) {
     };
     const renderLevel = window?._SSR_DATA?.renderLevel || external_constants_js_namespaceObject.RenderLevel.CLIENT_RENDER;
     const renderMode = window?._SSR_DATA?.mode || 'string';
-    if (isReact18() && 'stream' === renderMode) return streamSSRHydrate();
+    if ('stream' === renderMode) return streamSSRHydrate();
     function streamSSRHydrate() {
         if (renderLevel !== external_constants_js_namespaceObject.RenderLevel.SERVER_RENDER) return ModernRender((0, wrapper_js_namespaceObject.wrapRuntimeContextProvider)(App, context));
         {
@@ -65,7 +63,7 @@ function hydrateRoot(App, context, ModernRender, ModernHydrate) {
     function stringSSRHydrate() {
         if (renderLevel === external_constants_js_namespaceObject.RenderLevel.CLIENT_RENDER) return ModernRender((0, wrapper_js_namespaceObject.wrapRuntimeContextProvider)(App, context));
         if (renderLevel === external_constants_js_namespaceObject.RenderLevel.SERVER_RENDER) return new Promise((resolve)=>{
-            if (isReact18()) (0, component_namespaceObject.loadableReady)(()=>{
+            (0, component_namespaceObject.loadableReady)(()=>{
                 const SSRApp = ()=>/*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_withCallback_js_namespaceObject.WithCallback, {
                         callback: callback,
                         children: App
@@ -74,21 +72,14 @@ function hydrateRoot(App, context, ModernRender, ModernHydrate) {
                     resolve(root);
                 });
             });
-            else (0, component_namespaceObject.loadableReady)(()=>{
-                ModernHydrate((0, wrapper_js_namespaceObject.wrapRuntimeContextProvider)(App, hydrateContext), callback).then((root)=>{
-                    resolve(root);
-                });
-            });
         });
         console.warn(`unknow render level: ${renderLevel}, execute render()`);
         return ModernRender((0, wrapper_js_namespaceObject.wrapRuntimeContextProvider)(App, context));
     }
 }
 exports.hydrateRoot = __webpack_exports__.hydrateRoot;
-exports.isReact18 = __webpack_exports__.isReact18;
 for(var __rspack_i in __webpack_exports__)if (-1 === [
-    "hydrateRoot",
-    "isReact18"
+    "hydrateRoot"
 ].indexOf(__rspack_i)) exports[__rspack_i] = __webpack_exports__[__rspack_i];
 Object.defineProperty(exports, '__esModule', {
     value: true

package/dist/cjs/core/browser/index.js

@@ -37,20 +37,18 @@ var __webpack_require__ = {};
 var __webpack_exports__ = {};
 __webpack_require__.r(__webpack_exports__);
 __webpack_require__.d(__webpack_exports__, {
-    hydrateWithReact17: ()=>hydrateWithReact17,
-    hydrateWithReact18: ()=>hydrateWithReact18,
+    hydrateWithReact: ()=>hydrateWithReact,
     render: ()=>render,
-    renderWithReact17: ()=>renderWithReact17,
-    renderWithReact18: ()=>renderWithReact18
+    renderWithReact: ()=>renderWithReact
 });
 const constants_namespaceObject = require("@modern-js/utils/universal/constants");
 const external_cookie_namespaceObject = require("cookie");
 var external_cookie_default = /*#__PURE__*/ __webpack_require__.n(external_cookie_namespaceObject);
+const client_namespaceObject = require("react-dom/client");
 const index_js_namespaceObject = require("../context/index.js");
 const runtime_js_namespaceObject = require("../context/runtime.js");
 const wrapper_js_namespaceObject = require("../react/wrapper.js");
 const external_hydrate_js_namespaceObject = require("./hydrate.js");
-const IS_REACT18 = 'true' === process.env.IS_REACT18;
 const getQuery = ()=>window.location.search.substring(1).split('&').reduce((res, item)=>{
         const [key, value] = item.split('=');
         if (key) res[key] = value;
@@ -108,52 +106,34 @@ async function render(App, id) {
         await runBeforeRender(context);
         const rootElement = id && 'string' != typeof id ? id : document.getElementById(id || 'root');
         async function ModernRender(App) {
-            const renderFunc = IS_REACT18 ? renderWithReact18 : renderWithReact17;
-            return renderFunc(App, rootElement);
+            return renderWithReact(App, rootElement);
         }
-        async function ModernHydrate(App, callback) {
-            const hydrateFunc = IS_REACT18 ? hydrateWithReact18 : hydrateWithReact17;
-            return hydrateFunc(App, rootElement, callback);
+        async function ModernHydrate(App) {
+            return hydrateWithReact(App, rootElement);
         }
         if (window._SSR_DATA) return (0, external_hydrate_js_namespaceObject.hydrateRoot)(App, context, ModernRender, ModernHydrate);
         return ModernRender((0, wrapper_js_namespaceObject.wrapRuntimeContextProvider)(App, context));
     }
     throw Error('`render` function needs id in browser environment, it needs to be string or element');
 }
-async function renderWithReact18(App, rootElement) {
-    const ReactDOM = await import("react-dom/client");
-    const root = ReactDOM.createRoot(rootElement);
+async function renderWithReact(App, rootElement) {
+    const root = (0, client_namespaceObject.createRoot)(rootElement);
     root.render(App);
     return root;
 }
-async function renderWithReact17(App, rootElement) {
-    const ReactDOM = await import("react-dom");
-    ReactDOM.render(App, rootElement);
-    return rootElement;
-}
-async function hydrateWithReact18(App, rootElement) {
-    const ReactDOM = await import("react-dom/client");
-    const root = ReactDOM.hydrateRoot(rootElement, App, {
+async function hydrateWithReact(App, rootElement) {
+    const root = (0, client_namespaceObject.hydrateRoot)(rootElement, App, {
         identifierPrefix: constants_namespaceObject.SSR_HYDRATION_ID_PREFIX
     });
     return root;
 }
-async function hydrateWithReact17(App, rootElement, callback) {
-    const ReactDOM = await import("react-dom");
-    const root = ReactDOM.hydrate(App, rootElement, callback);
-    return root;
-}
-exports.hydrateWithReact17 = __webpack_exports__.hydrateWithReact17;
-exports.hydrateWithReact18 = __webpack_exports__.hydrateWithReact18;
+exports.hydrateWithReact = __webpack_exports__.hydrateWithReact;
 exports.render = __webpack_exports__.render;
-exports.renderWithReact17 = __webpack_exports__.renderWithReact17;
-exports.renderWithReact18 = __webpack_exports__.renderWithReact18;
+exports.renderWithReact = __webpack_exports__.renderWithReact;
 for(var __rspack_i in __webpack_exports__)if (-1 === [
-    "hydrateWithReact17",
-    "hydrateWithReact18",
+    "hydrateWithReact",
     "render",
-    "renderWithReact17",
-    "renderWithReact18"
+    "renderWithReact"
 ].indexOf(__rspack_i)) exports[__rspack_i] = __webpack_exports__[__rspack_i];
 Object.defineProperty(exports, '__esModule', {
     value: true

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

@@ -340,12 +340,13 @@ const documentPlugin = ()=>({
                 processedHtml = processCommentPlaceholders(processedHtml);
                 return `<!DOCTYPE html>${processedHtml}`.replace(external_constants_js_namespaceObject.DOCUMENT_META_PLACEHOLDER, ()=>metas).replace(external_constants_js_namespaceObject.DOCUMENT_SSR_PLACEHOLDER, ()=>external_constants_js_namespaceObject.HTML_SEPARATOR).replace(external_constants_js_namespaceObject.DOCUMENT_SCRIPTS_PLACEHOLDER, ()=>scripts).replace(external_constants_js_namespaceObject.DOCUMENT_LINKS_PLACEHOLDER, ()=>links).replace(external_constants_js_namespaceObject.DOCUMENT_CHUNKSMAP_PLACEHOLDER, ()=>external_constants_js_namespaceObject.PLACEHOLDER_REPLACER_MAP[external_constants_js_namespaceObject.DOCUMENT_CHUNKSMAP_PLACEHOLDER]).replace(external_constants_js_namespaceObject.DOCUMENT_SSRDATASCRIPT_PLACEHOLDER, ()=>external_constants_js_namespaceObject.PLACEHOLDER_REPLACER_MAP[external_constants_js_namespaceObject.DOCUMENT_SSRDATASCRIPT_PLACEHOLDER]).replace(external_constants_js_namespaceObject.DOCUMENT_TITLE_PLACEHOLDER, ()=>titles);
             };
-            const documentEntry = (entryName, templateParameters)=>{
+            const documentEntry = (entryName)=>{
                 const { entrypoints, internalDirectory, appDirectory } = api.getAppContext();
                 const documentFilePath = getDocumentByEntryName(entrypoints, entryName, appDirectory);
                 if (!documentFilePath) return null;
                 return async (templateData)=>{
                     const config = api.getNormalizedConfig();
+                    const { compilation: _compilation, htmlPlugin, rspackConfig: _rspackConfig, ...templateParameters } = templateData;
                     const documentParams = getDocParams({
                         config: config,
                         entryName,
@@ -363,7 +364,6 @@ const documentPlugin = ()=>({
                     debug("entry %s's document jsx rendered html: %o", entryName, html);
                     const { partialsByEntrypoint } = api.getAppContext();
                     html = processPartials(html, entryName, partialsByEntrypoint || {});
-                    const htmlPlugin = templateData.htmlPlugin || templateData.htmlWebpackPlugin || templateData.htmlRspackPlugin;
                     if (!htmlPlugin) throw new Error('Failed to get HTML plugin tags from template parameters.');
                     const { scripts, links, metas, titles } = extractHtmlTags(htmlPlugin, templateParameters);
                     return processPlaceholders(html, config, scripts, links, metas, titles);
@@ -375,10 +375,7 @@ const documentPlugin = ()=>({
                 return {
                     tools: {
                         htmlPlugin: (options, entry)=>{
-                            const hackParameters = 'function' == typeof options?.templateParameters ? options?.templateParameters({}, {}, {}, {}) : {
-                                ...options?.templateParameters
-                            };
-                            const templateContent = documentEntry(entry.entryName, hackParameters);
+                            const templateContent = documentEntry(entry.entryName);
                             const documentHtmlOptions = templateContent ? {
                                 templateContent,
                                 inject: false

package/dist/esm/cli/index.mjs

@@ -1,5 +1,5 @@
 import path_0 from "path";
-import { cleanRequireCache, isReact18 as utils_isReact18 } from "@modern-js/utils";
+import { cleanRequireCache } from "@modern-js/utils";
 import { documentPlugin } from "../document/cli/index.mjs";
 import { routerPlugin } from "../router/cli/index.mjs";
 import { builderPluginAlias } from "./alias.mjs";
@@ -54,12 +54,10 @@ const runtimePlugin = (params)=>({
             });
             api.config(()=>{
                 const { appDirectory, metaName } = api.getAppContext();
-                const isReact18 = utils_isReact18(appDirectory);
-                process.env.IS_REACT18 = isReact18.toString();
                 return {
                     source: {
                         globalVars: {
-                            'process.env.IS_REACT18': process.env.IS_REACT18
+                            'process.env.IS_REACT18': 'true'
                         },
                         include: [
                             new RegExp(`[\\\\/]node_modules[\\\\/]@${metaName}[\\\\/]runtime[\\\\/].*[\\\\/]head\\.`)
@@ -68,14 +66,6 @@ const runtimePlugin = (params)=>({
                     tools: {
                         bundlerChain: (chain)=>{
                             chain.module.rule('modern-entry').test(/\.jsx?$/).include.add(path_0.resolve(appDirectory, 'node_modules', `.${metaName}`)).end().sideEffects(true);
-                        },
-                        rspack: (_config, { appendPlugins, rspack })=>{
-                            if (!isReact18) appendPlugins([
-                                new rspack.IgnorePlugin({
-                                    resourceRegExp: /^react-dom\/client$/,
-                                    contextRegExp: /@modern-js\/runtime/
-                                })
-                            ]);
                         }
                     }
                 };

package/dist/esm/core/browser/hydrate.mjs

@@ -3,7 +3,6 @@ import { loadableReady } from "@loadable/component";
 import { RenderLevel } from "../constants.mjs";
 import { wrapRuntimeContextProvider } from "../react/wrapper.mjs";
 import { WithCallback } from "./withCallback.mjs";
-const isReact18 = ()=>'true' === process.env.IS_REACT18;
 function hydrateRoot(App, context, ModernRender, ModernHydrate) {
     const hydrateContext = {
         ...context,
@@ -17,7 +16,7 @@ function hydrateRoot(App, context, ModernRender, ModernHydrate) {
     };
     const renderLevel = window?._SSR_DATA?.renderLevel || RenderLevel.CLIENT_RENDER;
     const renderMode = window?._SSR_DATA?.mode || 'string';
-    if (isReact18() && 'stream' === renderMode) return streamSSRHydrate();
+    if ('stream' === renderMode) return streamSSRHydrate();
     function streamSSRHydrate() {
         if (renderLevel !== RenderLevel.SERVER_RENDER) return ModernRender(wrapRuntimeContextProvider(App, context));
         {
@@ -32,7 +31,7 @@ function hydrateRoot(App, context, ModernRender, ModernHydrate) {
     function stringSSRHydrate() {
         if (renderLevel === RenderLevel.CLIENT_RENDER) return ModernRender(wrapRuntimeContextProvider(App, context));
         if (renderLevel === RenderLevel.SERVER_RENDER) return new Promise((resolve)=>{
-            isReact18() ? loadableReady(()=>{
+            loadableReady(()=>{
                 const SSRApp = ()=>/*#__PURE__*/ jsx(WithCallback, {
                         callback: callback,
                         children: App
@@ -40,14 +39,10 @@ function hydrateRoot(App, context, ModernRender, ModernHydrate) {
                 ModernHydrate(wrapRuntimeContextProvider(/*#__PURE__*/ jsx(SSRApp, {}), hydrateContext)).then((root)=>{
                     resolve(root);
                 });
-            }) : loadableReady(()=>{
-                ModernHydrate(wrapRuntimeContextProvider(App, hydrateContext), callback).then((root)=>{
-                    resolve(root);
-                });
             });
         });
         console.warn(`unknow render level: ${renderLevel}, execute render()`);
         return ModernRender(wrapRuntimeContextProvider(App, context));
     }
 }
-export { hydrateRoot, isReact18 };
+export { hydrateRoot };

package/dist/esm/core/browser/index.mjs

@@ -1,10 +1,10 @@
 import { SSR_HYDRATION_ID_PREFIX } from "@modern-js/utils/universal/constants";
 import cookie from "cookie";
+import { createRoot, hydrateRoot } from "react-dom/client";
 import { getGlobalInternalRuntimeContext } from "../context/index.mjs";
 import { getInitialContext } from "../context/runtime.mjs";
 import { wrapRuntimeContextProvider } from "../react/wrapper.mjs";
-import { hydrateRoot } from "./hydrate.mjs";
-const IS_REACT18 = 'true' === process.env.IS_REACT18;
+import { hydrateRoot as external_hydrate_mjs_hydrateRoot } from "./hydrate.mjs";
 const getQuery = ()=>window.location.search.substring(1).split('&').reduce((res, item)=>{
         const [key, value] = item.split('=');
         if (key) res[key] = value;
@@ -62,39 +62,25 @@ async function render(App, id) {
         await runBeforeRender(context);
         const rootElement = id && 'string' != typeof id ? id : document.getElementById(id || 'root');
         async function ModernRender(App) {
-            const renderFunc = IS_REACT18 ? renderWithReact18 : renderWithReact17;
-            return renderFunc(App, rootElement);
+            return renderWithReact(App, rootElement);
         }
-        async function ModernHydrate(App, callback) {
-            const hydrateFunc = IS_REACT18 ? hydrateWithReact18 : hydrateWithReact17;
-            return hydrateFunc(App, rootElement, callback);
+        async function ModernHydrate(App) {
+            return hydrateWithReact(App, rootElement);
         }
-        if (window._SSR_DATA) return hydrateRoot(App, context, ModernRender, ModernHydrate);
+        if (window._SSR_DATA) return external_hydrate_mjs_hydrateRoot(App, context, ModernRender, ModernHydrate);
         return ModernRender(wrapRuntimeContextProvider(App, context));
     }
     throw Error('`render` function needs id in browser environment, it needs to be string or element');
 }
-async function renderWithReact18(App, rootElement) {
-    const ReactDOM = await import("react-dom/client");
-    const root = ReactDOM.createRoot(rootElement);
+async function renderWithReact(App, rootElement) {
+    const root = createRoot(rootElement);
     root.render(App);
     return root;
 }
-async function renderWithReact17(App, rootElement) {
-    const ReactDOM = await import("react-dom");
-    ReactDOM.render(App, rootElement);
-    return rootElement;
-}
-async function hydrateWithReact18(App, rootElement) {
-    const ReactDOM = await import("react-dom/client");
-    const root = ReactDOM.hydrateRoot(rootElement, App, {
+async function hydrateWithReact(App, rootElement) {
+    const root = hydrateRoot(rootElement, App, {
         identifierPrefix: SSR_HYDRATION_ID_PREFIX
     });
     return root;
 }
-async function hydrateWithReact17(App, rootElement, callback) {
-    const ReactDOM = await import("react-dom");
-    const root = ReactDOM.hydrate(App, rootElement, callback);
-    return root;
-}
-export { hydrateWithReact17, hydrateWithReact18, render, renderWithReact17, renderWithReact18 };
+export { hydrateWithReact, render, renderWithReact };

package/dist/esm/document/cli/index.mjs

@@ -295,12 +295,13 @@ const documentPlugin = ()=>({
                 processedHtml = processCommentPlaceholders(processedHtml);
                 return `<!DOCTYPE html>${processedHtml}`.replace(DOCUMENT_META_PLACEHOLDER, ()=>metas).replace(DOCUMENT_SSR_PLACEHOLDER, ()=>HTML_SEPARATOR).replace(DOCUMENT_SCRIPTS_PLACEHOLDER, ()=>scripts).replace(DOCUMENT_LINKS_PLACEHOLDER, ()=>links).replace(DOCUMENT_CHUNKSMAP_PLACEHOLDER, ()=>PLACEHOLDER_REPLACER_MAP[DOCUMENT_CHUNKSMAP_PLACEHOLDER]).replace(DOCUMENT_SSRDATASCRIPT_PLACEHOLDER, ()=>PLACEHOLDER_REPLACER_MAP[DOCUMENT_SSRDATASCRIPT_PLACEHOLDER]).replace(DOCUMENT_TITLE_PLACEHOLDER, ()=>titles);
             };
-            const documentEntry = (entryName, templateParameters)=>{
+            const documentEntry = (entryName)=>{
                 const { entrypoints, internalDirectory, appDirectory } = api.getAppContext();
                 const documentFilePath = getDocumentByEntryName(entrypoints, entryName, appDirectory);
                 if (!documentFilePath) return null;
                 return async (templateData)=>{
                     const config = api.getNormalizedConfig();
+                    const { compilation: _compilation, htmlPlugin, rspackConfig: _rspackConfig, ...templateParameters } = templateData;
                     const documentParams = getDocParams({
                         config: config,
                         entryName,
@@ -318,7 +319,6 @@ const documentPlugin = ()=>({
                     debug("entry %s's document jsx rendered html: %o", entryName, html);
                     const { partialsByEntrypoint } = api.getAppContext();
                     html = processPartials(html, entryName, partialsByEntrypoint || {});
-                    const htmlPlugin = templateData.htmlPlugin || templateData.htmlWebpackPlugin || templateData.htmlRspackPlugin;
                     if (!htmlPlugin) throw new Error('Failed to get HTML plugin tags from template parameters.');
                     const { scripts, links, metas, titles } = extractHtmlTags(htmlPlugin, templateParameters);
                     return processPlaceholders(html, config, scripts, links, metas, titles);
@@ -330,10 +330,7 @@ const documentPlugin = ()=>({
                 return {
                     tools: {
                         htmlPlugin: (options, entry)=>{
-                            const hackParameters = 'function' == typeof options?.templateParameters ? options?.templateParameters({}, {}, {}, {}) : {
-                                ...options?.templateParameters
-                            };
-                            const templateContent = documentEntry(entry.entryName, hackParameters);
+                            const templateContent = documentEntry(entry.entryName);
                             const documentHtmlOptions = templateContent ? {
                                 templateContent,
                                 inject: false

package/dist/esm-node/cli/index.mjs

@@ -1,7 +1,7 @@
 import __rslib_shim_module__ from "node:module";
 const require = /*#__PURE__*/ __rslib_shim_module__.createRequire(/*#__PURE__*/ (()=>import.meta.url)());
 import path_0 from "path";
-import { cleanRequireCache, isReact18 as utils_isReact18 } from "@modern-js/utils";
+import { cleanRequireCache } from "@modern-js/utils";
 import { documentPlugin } from "../document/cli/index.mjs";
 import { routerPlugin } from "../router/cli/index.mjs";
 import { builderPluginAlias } from "./alias.mjs";
@@ -56,12 +56,10 @@ const runtimePlugin = (params)=>({
             });
             api.config(()=>{
                 const { appDirectory, metaName } = api.getAppContext();
-                const isReact18 = utils_isReact18(appDirectory);
-                process.env.IS_REACT18 = isReact18.toString();
                 return {
                     source: {
                         globalVars: {
-                            'process.env.IS_REACT18': process.env.IS_REACT18
+                            'process.env.IS_REACT18': 'true'
                         },
                         include: [
                             new RegExp(`[\\\\/]node_modules[\\\\/]@${metaName}[\\\\/]runtime[\\\\/].*[\\\\/]head\\.`)
@@ -70,14 +68,6 @@ const runtimePlugin = (params)=>({
                     tools: {
                         bundlerChain: (chain)=>{
                             chain.module.rule('modern-entry').test(/\.jsx?$/).include.add(path_0.resolve(appDirectory, 'node_modules', `.${metaName}`)).end().sideEffects(true);
-                        },
-                        rspack: (_config, { appendPlugins, rspack })=>{
-                            if (!isReact18) appendPlugins([
-                                new rspack.IgnorePlugin({
-                                    resourceRegExp: /^react-dom\/client$/,
-                                    contextRegExp: /@modern-js\/runtime/
-                                })
-                            ]);
                         }
                     }
                 };

package/dist/esm-node/core/browser/hydrate.mjs

@@ -4,7 +4,6 @@ import { loadableReady } from "@loadable/component";
 import { RenderLevel } from "../constants.mjs";
 import { wrapRuntimeContextProvider } from "../react/wrapper.mjs";
 import { WithCallback } from "./withCallback.mjs";
-const isReact18 = ()=>'true' === process.env.IS_REACT18;
 function hydrateRoot(App, context, ModernRender, ModernHydrate) {
     const hydrateContext = {
         ...context,
@@ -18,7 +17,7 @@ function hydrateRoot(App, context, ModernRender, ModernHydrate) {
     };
     const renderLevel = window?._SSR_DATA?.renderLevel || RenderLevel.CLIENT_RENDER;
     const renderMode = window?._SSR_DATA?.mode || 'string';
-    if (isReact18() && 'stream' === renderMode) return streamSSRHydrate();
+    if ('stream' === renderMode) return streamSSRHydrate();
     function streamSSRHydrate() {
         if (renderLevel !== RenderLevel.SERVER_RENDER) return ModernRender(wrapRuntimeContextProvider(App, context));
         {
@@ -33,7 +32,7 @@ function hydrateRoot(App, context, ModernRender, ModernHydrate) {
     function stringSSRHydrate() {
         if (renderLevel === RenderLevel.CLIENT_RENDER) return ModernRender(wrapRuntimeContextProvider(App, context));
         if (renderLevel === RenderLevel.SERVER_RENDER) return new Promise((resolve)=>{
-            isReact18() ? loadableReady(()=>{
+            loadableReady(()=>{
                 const SSRApp = ()=>/*#__PURE__*/ jsx(WithCallback, {
                         callback: callback,
                         children: App
@@ -41,14 +40,10 @@ function hydrateRoot(App, context, ModernRender, ModernHydrate) {
                 ModernHydrate(wrapRuntimeContextProvider(/*#__PURE__*/ jsx(SSRApp, {}), hydrateContext)).then((root)=>{
                     resolve(root);
                 });
-            }) : loadableReady(()=>{
-                ModernHydrate(wrapRuntimeContextProvider(App, hydrateContext), callback).then((root)=>{
-                    resolve(root);
-                });
             });
         });
         console.warn(`unknow render level: ${renderLevel}, execute render()`);
         return ModernRender(wrapRuntimeContextProvider(App, context));
     }
 }
-export { hydrateRoot, isReact18 };
+export { hydrateRoot };

package/dist/esm-node/core/browser/index.mjs

@@ -1,11 +1,11 @@
 import "node:module";
 import { SSR_HYDRATION_ID_PREFIX } from "@modern-js/utils/universal/constants";
 import cookie from "cookie";
+import { createRoot, hydrateRoot } from "react-dom/client";
 import { getGlobalInternalRuntimeContext } from "../context/index.mjs";
 import { getInitialContext } from "../context/runtime.mjs";
 import { wrapRuntimeContextProvider } from "../react/wrapper.mjs";
-import { hydrateRoot } from "./hydrate.mjs";
-const IS_REACT18 = 'true' === process.env.IS_REACT18;
+import { hydrateRoot as external_hydrate_mjs_hydrateRoot } from "./hydrate.mjs";
 const getQuery = ()=>window.location.search.substring(1).split('&').reduce((res, item)=>{
         const [key, value] = item.split('=');
         if (key) res[key] = value;
@@ -63,39 +63,25 @@ async function render(App, id) {
         await runBeforeRender(context);
         const rootElement = id && 'string' != typeof id ? id : document.getElementById(id || 'root');
         async function ModernRender(App) {
-            const renderFunc = IS_REACT18 ? renderWithReact18 : renderWithReact17;
-            return renderFunc(App, rootElement);
+            return renderWithReact(App, rootElement);
         }
-        async function ModernHydrate(App, callback) {
-            const hydrateFunc = IS_REACT18 ? hydrateWithReact18 : hydrateWithReact17;
-            return hydrateFunc(App, rootElement, callback);
+        async function ModernHydrate(App) {
+            return hydrateWithReact(App, rootElement);
         }
-        if (window._SSR_DATA) return hydrateRoot(App, context, ModernRender, ModernHydrate);
+        if (window._SSR_DATA) return external_hydrate_mjs_hydrateRoot(App, context, ModernRender, ModernHydrate);
         return ModernRender(wrapRuntimeContextProvider(App, context));
     }
     throw Error('`render` function needs id in browser environment, it needs to be string or element');
 }
-async function renderWithReact18(App, rootElement) {
-    const ReactDOM = await import("react-dom/client");
-    const root = ReactDOM.createRoot(rootElement);
+async function renderWithReact(App, rootElement) {
+    const root = createRoot(rootElement);
     root.render(App);
     return root;
 }
-async function renderWithReact17(App, rootElement) {
-    const ReactDOM = await import("react-dom");
-    ReactDOM.render(App, rootElement);
-    return rootElement;
-}
-async function hydrateWithReact18(App, rootElement) {
-    const ReactDOM = await import("react-dom/client");
-    const root = ReactDOM.hydrateRoot(rootElement, App, {
+async function hydrateWithReact(App, rootElement) {
+    const root = hydrateRoot(rootElement, App, {
         identifierPrefix: SSR_HYDRATION_ID_PREFIX
     });
     return root;
 }
-async function hydrateWithReact17(App, rootElement, callback) {
-    const ReactDOM = await import("react-dom");
-    const root = ReactDOM.hydrate(App, rootElement, callback);
-    return root;
-}
-export { hydrateWithReact17, hydrateWithReact18, render, renderWithReact17, renderWithReact18 };
+export { hydrateWithReact, render, renderWithReact };

package/dist/esm-node/core/server/stream/beforeTemplate.mjs

@@ -7,11 +7,11 @@ import { buildHtml } from "../shared.mjs";
 import { checkIsNode, hasStylesheetLink, safeReplace } from "../utils.mjs";
 import { fileURLToPath as __rspack_fileURLToPath } from "node:url";
 import { dirname as __rspack_dirname } from "node:path";
-var beforeTemplate_dirname = __rspack_dirname(__rspack_fileURLToPath(import.meta.url));
+var __rspack_import_meta_dirname__ = __rspack_dirname(__rspack_fileURLToPath(import.meta.url));
 const readAsset = async (chunk)=>{
     const fs = await import("fs/promises");
     const path = await import("path");
-    const filepath = path.join(beforeTemplate_dirname, chunk);
+    const filepath = path.join(__rspack_import_meta_dirname__, chunk);
     return fs.readFile(filepath, 'utf-8');
 };
 const checkIsInline = (chunk, enableInline)=>{

package/dist/esm-node/core/server/string/loadable.mjs

@@ -3,7 +3,7 @@ import { ChunkExtractor } from "@loadable/server";
 import { attributesToString, checkIsNode, hasStylesheetLink } from "../utils.mjs";
 import { fileURLToPath as __rspack_fileURLToPath } from "node:url";
 import { dirname as __rspack_dirname } from "node:path";
-var loadable_dirname = __rspack_dirname(__rspack_fileURLToPath(import.meta.url));
+var __rspack_import_meta_dirname__ = __rspack_dirname(__rspack_fileURLToPath(import.meta.url));
 const extname = (uri)=>{
     if ('string' != typeof uri || !uri.includes('.')) return '';
     return `.${uri?.split('.').pop()}` || '';
@@ -17,7 +17,7 @@ const checkIsInline = (chunk, enableInline)=>{
 const readAsset = async (chunk)=>{
     const fs = await import("fs/promises");
     const path = await import("path");
-    const filepath = path.resolve(loadable_dirname, chunk.filename);
+    const filepath = path.resolve(__rspack_import_meta_dirname__, chunk.filename);
     return fs.readFile(filepath, 'utf-8');
 };
 class LoadableCollector {

package/dist/esm-node/document/cli/index.mjs

@@ -297,12 +297,13 @@ const documentPlugin = ()=>({
                 processedHtml = processCommentPlaceholders(processedHtml);
                 return `<!DOCTYPE html>${processedHtml}`.replace(DOCUMENT_META_PLACEHOLDER, ()=>metas).replace(DOCUMENT_SSR_PLACEHOLDER, ()=>HTML_SEPARATOR).replace(DOCUMENT_SCRIPTS_PLACEHOLDER, ()=>scripts).replace(DOCUMENT_LINKS_PLACEHOLDER, ()=>links).replace(DOCUMENT_CHUNKSMAP_PLACEHOLDER, ()=>PLACEHOLDER_REPLACER_MAP[DOCUMENT_CHUNKSMAP_PLACEHOLDER]).replace(DOCUMENT_SSRDATASCRIPT_PLACEHOLDER, ()=>PLACEHOLDER_REPLACER_MAP[DOCUMENT_SSRDATASCRIPT_PLACEHOLDER]).replace(DOCUMENT_TITLE_PLACEHOLDER, ()=>titles);
             };
-            const documentEntry = (entryName, templateParameters)=>{
+            const documentEntry = (entryName)=>{
                 const { entrypoints, internalDirectory, appDirectory } = api.getAppContext();
                 const documentFilePath = getDocumentByEntryName(entrypoints, entryName, appDirectory);
                 if (!documentFilePath) return null;
                 return async (templateData)=>{
                     const config = api.getNormalizedConfig();
+                    const { compilation: _compilation, htmlPlugin, rspackConfig: _rspackConfig, ...templateParameters } = templateData;
                     const documentParams = getDocParams({
                         config: config,
                         entryName,
@@ -320,7 +321,6 @@ const documentPlugin = ()=>({
                     debug("entry %s's document jsx rendered html: %o", entryName, html);
                     const { partialsByEntrypoint } = api.getAppContext();
                     html = processPartials(html, entryName, partialsByEntrypoint || {});
-                    const htmlPlugin = templateData.htmlPlugin || templateData.htmlWebpackPlugin || templateData.htmlRspackPlugin;
                     if (!htmlPlugin) throw new Error('Failed to get HTML plugin tags from template parameters.');
                     const { scripts, links, metas, titles } = extractHtmlTags(htmlPlugin, templateParameters);
                     return processPlaceholders(html, config, scripts, links, metas, titles);
@@ -332,10 +332,7 @@ const documentPlugin = ()=>({
                 return {
                     tools: {
                         htmlPlugin: (options, entry)=>{
-                            const hackParameters = 'function' == typeof options?.templateParameters ? options?.templateParameters({}, {}, {}, {}) : {
-                                ...options?.templateParameters
-                            };
-                            const templateContent = documentEntry(entry.entryName, hackParameters);
+                            const templateContent = documentEntry(entry.entryName);
                             const documentHtmlOptions = templateContent ? {
                                 templateContent,
                                 inject: false

package/dist/esm-node/router/cli/index.mjs

@@ -5,7 +5,7 @@ import { isRouteEntry } from "./entry.mjs";
 import { handleFileChange, handleGeneratorEntryCode, handleModifyEntrypoints } from "./handler.mjs";
 import { fileURLToPath as __rspack_fileURLToPath } from "node:url";
 import { dirname as __rspack_dirname } from "node:path";
-var cli_dirname = __rspack_dirname(__rspack_fileURLToPath(import.meta.url));
+var __rspack_import_meta_dirname__ = __rspack_dirname(__rspack_fileURLToPath(import.meta.url));
 const routerPlugin = ()=>({
         name: '@modern-js/plugin-router',
         required: [
@@ -46,7 +46,7 @@ const routerPlugin = ()=>({
                         include: [
                             /[\\/]node_modules[\\/]react-router[\\/]/,
                             /[\\/]node_modules[\\/]react-router-dom[\\/]/,
-                            node_path.resolve(cli_dirname, '../runtime').replace('cjs', 'esm')
+                            node_path.resolve(__rspack_import_meta_dirname__, '../runtime').replace('cjs', 'esm')
                         ]
                     }
                 }));

package/dist/types/core/browser/hydrate.d.ts

@@ -1,5 +1,4 @@
 import type React from 'react';
 import type { Root } from 'react-dom/client';
 import type { TRuntimeContext } from '../context/runtime';
-export declare const isReact18: () => boolean;
-export declare function hydrateRoot(App: React.ReactElement, context: TRuntimeContext, ModernRender: (App: React.ReactElement) => Promise<HTMLElement | Root>, ModernHydrate: (App: React.ReactElement, callback?: () => void) => Promise<HTMLElement | Root>): Promise<HTMLElement | Root>;
+export declare function hydrateRoot(App: React.ReactElement, context: TRuntimeContext, ModernRender: (App: React.ReactElement) => Promise<HTMLElement | Root>, ModernHydrate: (App: React.ReactElement) => Promise<HTMLElement | Root>): Promise<HTMLElement | Root>;

package/dist/types/core/browser/index.d.ts

@@ -3,7 +3,5 @@ export type RenderFunc = typeof render;
 export declare function render(App: React.ReactElement<{
     basename: string;
 }>, id?: HTMLElement | string): Promise<HTMLElement | import("react-dom/client").Root>;
-export declare function renderWithReact18(App: React.ReactElement, rootElement: HTMLElement): Promise<import("react-dom/client").Root>;
-export declare function renderWithReact17(App: React.ReactElement, rootElement: HTMLElement): Promise<HTMLElement>;
-export declare function hydrateWithReact18(App: React.ReactElement, rootElement: HTMLElement): Promise<import("react-dom/client").Root>;
-export declare function hydrateWithReact17(App: React.ReactElement, rootElement: HTMLElement, callback?: () => void): Promise<any>;
+export declare function renderWithReact(App: React.ReactElement, rootElement: HTMLElement): Promise<import("react-dom/client").Root>;
+export declare function hydrateWithReact(App: React.ReactElement, rootElement: HTMLElement): Promise<import("react-dom/client").Root>;

package/package.json

@@ -15,7 +15,7 @@
     "modern",
     "modern.js"
   ],
-  "version": "3.4.0",
+  "version": "3.6.0",
   "engines": {
     "node": ">=20"
   },
@@ -215,21 +215,21 @@
     "isbot": "3.8.0",
     "react-helmet": "^6.1.0",
     "react-is": "^18.3.1",
-    "@modern-js/plugin": "3.4.0",
-    "@modern-js/plugin-data-loader": "3.4.0",
-    "@modern-js/runtime-utils": "3.4.0",
-    "@modern-js/render": "3.4.0",
-    "@modern-js/types": "3.4.0",
-    "@modern-js/utils": "3.4.0"
+    "@modern-js/plugin": "3.6.0",
+    "@modern-js/plugin-data-loader": "3.6.0",
+    "@modern-js/render": "3.6.0",
+    "@modern-js/runtime-utils": "3.6.0",
+    "@modern-js/types": "3.6.0",
+    "@modern-js/utils": "3.6.0"
   },
   "peerDependencies": {
-    "react": ">=17.0.2",
-    "react-dom": ">=17.0.2"
+    "react": ">=18.0.0",
+    "react-dom": ">=18.0.0"
   },
   "devDependencies": {
     "@remix-run/web-fetch": "^4.1.3",
-    "@rsbuild/core": "2.0.10",
-    "@rslib/core": "0.22.1",
+    "@rsbuild/core": "2.1.0",
+    "@rslib/core": "0.23.2",
     "@testing-library/dom": "^10.4.1",
     "@testing-library/react": "^16.3.2",
     "@types/cookie": "0.6.0",
@@ -240,7 +240,7 @@
     "react-dom": "^19.2.7",
     "ts-node": "^10.9.2",
     "typescript": "^5",
-    "@modern-js/app-tools": "3.4.0",
+    "@modern-js/app-tools": "3.6.0",
     "@modern-js/rslib": "2.68.10",
     "@scripts/rstest-config": "2.66.0"
   },