@modern-js/runtime 2.17.1 → 2.18.1

package/dist/esm-node/router/runtime/plugin.js

@@ -1,7 +1,7 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import { createBrowserRouter, createHashRouter, RouterProvider, createRoutesFromElements, useMatches, useLocation } from "react-router-dom";
 import hoistNonReactStatics from "hoist-non-react-statics";
-import { parsedJSONFromElement } from "@modern-js/utils/runtime";
+import { parsedJSONFromElement } from "@modern-js/utils/runtime-browser";
 import { modifyRoutes as modifyRoutesHook } from "./hooks";
 import { deserializeErrors, renderRoutes, urlJoin } from "./utils";
 export let finalRouteConfig = {

package/dist/esm-node/router/runtime/plugin.node.js

@@ -1,6 +1,6 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import { useContext } from "react";
-import { createStaticHandler } from "@modern-js/utils/universal/remix-router";
+import { createStaticHandler } from "@modern-js/utils/runtime/router";
 import { createStaticRouter, StaticRouterProvider } from "react-router-dom/server";
 import hoistNonReactStatics from "hoist-non-react-statics";
 import { createRoutesFromElements } from "react-router-dom";

package/dist/esm-node/router/runtime/utils.js

@@ -1,7 +1,6 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import { Route } from "react-router-dom";
-import { ErrorResponse, isRouteErrorResponse } from "@modern-js/utils/universal/remix-router";
-import { renderNestedRoute } from "@modern-js/utils/universal/nestedRoutes";
+import { ErrorResponse, isRouteErrorResponse, renderNestedRoute } from "@modern-js/utils/runtime/router";
 import { DefaultNotFound } from "./DefaultNotFound";
 import DeferredDataScripts from "./DeferredDataScripts";
 export function getRouteComponents(routes, { globalApp, ssrMode, props }) {

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

@@ -29,21 +29,36 @@ export default () => {
         config() {
           const appContext = api.useAppContext();
           pluginsExportsUtils = createRuntimeExportsUtils(appContext.internalDirectory, "plugins");
+          const userConfig = api.useResolvedConfigContext();
           const { bundlerType = "webpack" } = api.useAppContext();
-          const babelConfig = bundlerType === "webpack" ? (config) => {
-            var _config_plugins;
-            (_config_plugins = config.plugins) === null || _config_plugins === void 0 ? void 0 : _config_plugins.push(path.join(__dirname, "./babel-plugin-ssr-loader-id"));
-            const userConfig = api.useResolvedConfigContext();
-            if (isUseSSRBundle(userConfig) && hasStringSSREntry(userConfig)) {
-              var _config_plugins1;
-              (_config_plugins1 = config.plugins) === null || _config_plugins1 === void 0 ? void 0 : _config_plugins1.push(require.resolve("@loadable/babel-plugin"));
+          const babelConfig = (() => {
+            if (bundlerType === "webpack") {
+              return (config) => {
+                var _config_plugins;
+                (_config_plugins = config.plugins) === null || _config_plugins === void 0 ? void 0 : _config_plugins.push(path.join(__dirname, "./babel-plugin-ssr-loader-id"));
+                if (isUseSSRBundle(userConfig) && hasStringSSREntry(userConfig)) {
+                  var _config_plugins1;
+                  (_config_plugins1 = config.plugins) === null || _config_plugins1 === void 0 ? void 0 : _config_plugins1.push(require.resolve("@loadable/babel-plugin"));
+                }
+              };
+            } else if (bundlerType === "rspack") {
+              if (isUseSSRBundle(userConfig)) {
+                return (config) => {
+                  var _config_plugins;
+                  (_config_plugins = config.plugins) === null || _config_plugins === void 0 ? void 0 : _config_plugins.push(path.join(__dirname, "./babel-plugin-ssr-loader-id"));
+                  if (hasStringSSREntry(userConfig)) {
+                    var _config_plugins1;
+                    (_config_plugins1 = config.plugins) === null || _config_plugins1 === void 0 ? void 0 : _config_plugins1.push(require.resolve("@loadable/babel-plugin"));
+                  }
+                };
+              }
             }
-          } : void 0;
+          })();
           return {
             source: {
               alias: {
-                // ensure that all packages use the same storage in @modern-js/utils/ssr
-                "@modern-js/utils/ssr": require.resolve("@modern-js/utils/ssr"),
+                // ensure that all packages use the same storage in @modern-js/utils/runtime-node
+                "@modern-js/utils/runtime-node": require.resolve("@modern-js/utils/runtime-node"),
                 "@modern-js/runtime/plugins": pluginsExportsUtils.getPath()
               },
               globalVars: (values, { target }) => {
@@ -51,11 +66,11 @@ export default () => {
               }
             },
             tools: {
-              webpackChain: (chain, { isServer, isServiceWorker, CHAIN_ID }) => {
-                const userConfig = api.useResolvedConfigContext();
-                if (isUseSSRBundle(userConfig) && !isServer && !isServiceWorker && hasStringSSREntry(userConfig)) {
-                  const LoadableWebpackPlugin = require("@loadable/webpack-plugin");
-                  chain.plugin(CHAIN_ID.PLUGIN.LOADABLE).use(LoadableWebpackPlugin, [
+              bundlerChain(chain, { isServer, isServiceWorker, CHAIN_ID }) {
+                const userConfig2 = api.useResolvedConfigContext();
+                if (isUseSSRBundle(userConfig2) && !isServer && !isServiceWorker && hasStringSSREntry(userConfig2)) {
+                  const LoadableBundlerPlugin = require("./loadable-bundler-plugin.js");
+                  chain.plugin(CHAIN_ID.PLUGIN.LOADABLE).use(LoadableBundlerPlugin, [
                     {
                       filename: LOADABLE_STATS_FILE
                     }

package/dist/esm-node/ssr/cli/loadable-bundler-plugin.js

@@ -0,0 +1,103 @@
+function _define_property(obj, key, value) {
+  if (key in obj) {
+    Object.defineProperty(obj, key, {
+      value,
+      enumerable: true,
+      configurable: true,
+      writable: true
+    });
+  } else {
+    obj[key] = value;
+  }
+  return obj;
+}
+import path from "path";
+import { fs } from "@modern-js/utils";
+class LoadablePlugin {
+  apply(compiler) {
+    this.compiler = compiler;
+    compiler.options.output.chunkLoadingGlobal = this.opts.chunkLoadingGlobal;
+    if (this.opts.outputAsset || this.opts.writeToDisk) {
+      compiler.hooks.make.tap(LoadablePlugin.name, (compilation) => {
+        compilation.hooks.processAssets.tap({
+          name: LoadablePlugin.name,
+          stage: compiler.webpack.Compilation.PROCESS_ASSETS_STAGE_REPORT
+        }, () => {
+          const asset = this.handleEmit(compilation);
+          if (asset) {
+            compilation.emitAsset(this.opts.filename, asset);
+          }
+        });
+      });
+    }
+  }
+  handleEmit(compilation) {
+    const stats = compilation.getStats().toJson({
+      all: false,
+      assets: true,
+      // rspack not support cachedAssets,
+      cachedAssets: true,
+      chunks: true,
+      chunkGroups: true,
+      entrypoints: true,
+      // rspack not support chunkGroupChildren.
+      chunkGroupChildren: true,
+      hash: true,
+      ids: true,
+      outputPath: true,
+      publicPath: true
+    });
+    const output = {
+      ...stats,
+      generator: "loadable-components",
+      chunks: [
+        ...stats.chunks || []
+      ].map((chunk) => {
+        return {
+          id: chunk.id,
+          files: [
+            ...chunk.files || []
+          ]
+        };
+      })
+    };
+    const result = JSON.stringify(output, null, 2);
+    if (this.opts.writeToDisk) {
+      this.writeAssetsFile(result);
+    }
+    if (this.opts.outputAsset) {
+      return {
+        source() {
+          return result;
+        },
+        size() {
+          return result.length;
+        }
+      };
+    }
+    return null;
+  }
+  writeAssetsFile(manifest) {
+    var _this_compiler;
+    const outputFolder = (_this_compiler = this.compiler) === null || _this_compiler === void 0 ? void 0 : _this_compiler.options.output.path;
+    const outputFile = path.resolve(outputFolder || "", this.opts.filename);
+    fs.outputFileSync(outputFile, manifest);
+  }
+  constructor({ filename = "loadable-stats.json", path: path2, writeToDisk, outputAsset = true, chunkLoadingGlobal = "__LOADABLE_LOADED_CHUNKS__" } = {
+    filename: "loadable-stats.json",
+    outputAsset: true,
+    chunkLoadingGlobal: "__LOADABLE_LOADED_CHUNKS__"
+  }) {
+    _define_property(this, "opts", void 0);
+    _define_property(this, "compiler", void 0);
+    this.opts = {
+      filename,
+      path: path2,
+      writeToDisk,
+      outputAsset,
+      chunkLoadingGlobal
+    };
+    this.compiler = null;
+  }
+}
+module.exports = LoadablePlugin;

package/dist/esm-node/ssr/index.js

@@ -1,7 +1,7 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import { loadableReady } from "@loadable/component";
 import hoistNonReactStatics from "hoist-non-react-statics";
-import { parsedJSONFromElement } from "@modern-js/utils/runtime";
+import { parsedJSONFromElement } from "@modern-js/utils/runtime-browser";
 import { RenderLevel } from "./serverRender/types";
 import { WithCallback } from "./react/withCallback";
 import { formatClient, mockResponse, isReact18 } from "./utils";

package/dist/esm-node/ssr/prefetch.js

@@ -1,6 +1,6 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import { renderToStaticMarkup } from "react-dom/server";
-import { run } from "@modern-js/utils/ssr";
+import { run } from "@modern-js/utils/runtime-node";
 import { ChunkExtractor } from "@loadable/server";
 const prefetch = async (App, context) => {
   return run(context.ssrContext.request.headers, async () => {

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

@@ -1,4 +1,4 @@
-import { serializeJson } from "@modern-js/utils/universal/serialize";
+import { serializeJson } from "@modern-js/utils/runtime-node";
 import { buildTemplate } from "./buildTemplate.share";
 export function buildShellAfterTemplate(afterAppTemplate, options) {
   const callbacks = [

package/dist/esm-node/ssr/serverRender/renderToStream/index.js

@@ -1,5 +1,5 @@
 import { createElement } from "react";
-import { run } from "@modern-js/utils/ssr";
+import { run } from "@modern-js/utils/runtime-node";
 import { PreRender } from "../../react/prerender";
 import { time } from "../time";
 import renderToPipe from "./renderToPipe";

package/dist/esm-node/ssr/serverRender/renderToString/entry.js

@@ -13,7 +13,7 @@ function _define_property(obj, key, value) {
 }
 import React from "react";
 import ReactDomServer from "react-dom/server";
-import { serializeJson } from "@modern-js/utils/universal/serialize";
+import { serializeJson } from "@modern-js/utils/runtime-node";
 import ReactHelmet from "react-helmet";
 import { serializeErrors } from "../../../router/runtime/utils";
 import helmetReplace from "../helmet";

package/dist/esm-node/ssr/serverRender/renderToString/index.js

@@ -1,4 +1,4 @@
-import { run } from "@modern-js/utils/ssr";
+import { run } from "@modern-js/utils/runtime-node";
 import { PreRender } from "../../react/prerender";
 import { time } from "../time";
 import SSREntry from "./entry";

package/dist/types/router/runtime/index.d.ts

@@ -10,4 +10,4 @@ export type { LinkProps, NavLinkProps } from './PrefetchLink';
 export declare const useRouteLoaderData: typeof useRouteData;
 export type { FormEncType, FormMethod, GetScrollRestorationKeyFunction, ParamKeyValuePair, SubmitOptions, URLSearchParamsInit, FetcherWithComponents, BrowserRouterProps, HashRouterProps, HistoryRouterProps, FormProps, ScrollRestorationProps, SubmitFunction, ActionFunction, ActionFunctionArgs, AwaitProps, unstable_Blocker, unstable_BlockerFunction, DataRouteMatch, DataRouteObject, Fetcher, Hash, IndexRouteObject, IndexRouteProps, JsonFunction, LayoutRouteProps, LoaderFunction, LoaderFunctionArgs, Location, MemoryRouterProps, NavigateFunction, NavigateOptions, NavigateProps, Navigation, Navigator, NonIndexRouteObject, OutletProps, Params, ParamParseKey, Path, PathMatch, Pathname, PathPattern, PathRouteProps, RedirectFunction, RelativeRoutingType, RouteMatch, RouteObject, RouteProps, RouterProps, RouterProviderProps, RoutesProps, Search, ShouldRevalidateFunction, To } from 'react-router-dom';
 export { createBrowserRouter, createHashRouter, createMemoryRouter, RouterProvider, BrowserRouter, HashRouter, MemoryRouter, Router, Await, Form, Navigate, Outlet, Route, Routes, ScrollRestoration, useActionData, useAsyncError, useAsyncValue, useBeforeUnload, useFetcher, useFetchers, useFormAction, useHref, useInRouterContext, useLinkClickHandler, useLoaderData, useLocation, useMatch, useMatches, useNavigate, useNavigation, useNavigationType, useOutlet, useOutletContext, useParams, useResolvedPath, useRevalidator, useRouteError, useRoutes, useSearchParams, useSubmit, createRoutesFromChildren, createRoutesFromElements, createSearchParams, generatePath, isRouteErrorResponse, matchPath, matchRoutes, renderMatches, resolvePath, createPath, unstable_useBlocker, unstable_usePrompt } from 'react-router-dom';
-export { defer, json, redirect } from '@modern-js/utils/universal/remix-router';
+export { defer, json, redirect } from '@modern-js/utils/runtime/router';

package/dist/types/router/runtime/utils.d.ts

@@ -1,6 +1,6 @@
 import React from 'react';
 import { type NestedRoute, type PageRoute, type SSRMode } from '@modern-js/types';
-import { type Router, type StaticHandlerContext } from '@modern-js/utils/universal/remix-router';
+import { type Router, type StaticHandlerContext } from '@modern-js/utils/runtime/router';
 import { RouterConfig } from './types';
 export declare function getRouteComponents(routes: (NestedRoute | PageRoute)[], {
   globalApp,

package/dist/types/runtimeContext.d.ts

@@ -1,6 +1,6 @@
 /// <reference types="react" />
 import { Store } from '@modern-js-reduck/store';
-import type { StaticHandlerContext } from '@modern-js/utils/universal/remix-router';
+import type { StaticHandlerContext } from '@modern-js/utils/runtime/router';
 import { createLoaderManager } from './core/loader/loaderManager';
 import { runtime } from './core/plugin';
 import { RouteManifest } from './router/runtime/types';

package/dist/types/ssr/cli/loadable-bundler-plugin.d.ts

@@ -0,0 +1,10 @@
+/**
+ * The following code is modified based on
+ * https://github.com/gregberge/loadable-components
+ *
+ * MIT Licensed
+ * Author Greg Bergé
+ * Copyright 2019 Greg Bergé
+ * https://github.com/gregberge/loadable-components/blob/main/LICENSE
+ */
+export {};

package/package.json

@@ -15,7 +15,7 @@
     "modern",
     "modern.js"
   ],
-  "version": "2.17.1",
+  "version": "2.18.1",
   "engines": {
     "node": ">=14.17.6"
   },
@@ -162,9 +162,9 @@
     "react-side-effect": "^2.1.1",
     "redux-logger": "^3.0.6",
     "styled-components": "^5.3.1",
-    "@modern-js/plugin": "2.17.1",
-    "@modern-js/types": "2.17.1",
-    "@modern-js/utils": "2.17.1"
+    "@modern-js/plugin": "2.18.1",
+    "@modern-js/types": "2.18.1",
+    "@modern-js/utils": "2.18.1"
   },
   "peerDependencies": {
     "react": ">=17",
@@ -184,11 +184,11 @@
     "react-dom": "^18",
     "ts-jest": "^29.0.5",
     "typescript": "^4",
-    "@modern-js/app-tools": "2.17.1",
-    "@modern-js/core": "2.17.1",
-    "@modern-js/server-core": "2.17.1",
-    "@scripts/build": "2.17.1",
-    "@scripts/jest-config": "2.17.1"
+    "@modern-js/app-tools": "2.18.1",
+    "@modern-js/core": "2.18.1",
+    "@modern-js/server-core": "2.18.1",
+    "@scripts/build": "2.18.1",
+    "@scripts/jest-config": "2.18.1"
   },
   "sideEffects": false,
   "modernConfig": {},