@modern-js/runtime 2.22.0 → 2.22.2-alpha.0

package/dist/js/modern/router/runtime/withRouter.js

@@ -0,0 +1,36 @@
+var __defProp = Object.defineProperty;
+var __defProps = Object.defineProperties;
+var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp.call(b, prop))
+      __defNormalProp(a, prop, b[prop]);
+  if (__getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(b)) {
+      if (__propIsEnum.call(b, prop))
+        __defNormalProp(a, prop, b[prop]);
+    }
+  return a;
+};
+var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
+import { jsx } from "react/jsx-runtime";
+import { useLocation, useNavigate, useParams } from "react-router-dom";
+const withRouter = (Component) => {
+  return (props) => {
+    const location = useLocation();
+    const params = useParams();
+    const navigate = useNavigate();
+    return /* @__PURE__ */ jsx(Component, __spreadProps(__spreadValues({}, props), {
+      location,
+      params,
+      navigate
+    }));
+  };
+};
+export {
+  withRouter
+};

package/dist/js/modern/runtime-context.js

@@ -0,0 +1,7 @@
+import { createContext } from "react";
+const RuntimeReactContext = createContext({});
+const ServerRouterContext = createContext({});
+export {
+  RuntimeReactContext,
+  ServerRouterContext
+};

package/dist/js/modern/ssr/cli/babel-plugin-ssr-loader-id.js

@@ -0,0 +1,130 @@
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __commonJS = (cb, mod) => function __require() {
+  return mod || (0, cb[__getOwnPropNames(cb)[0]])((mod = { exports: {} }).exports, mod), mod.exports;
+};
+import crypto from "crypto";
+import { Buffer as Buffer2 } from "buffer";
+import * as t from "@babel/types";
+import { get } from "@modern-js/utils/lodash";
+var require_babel_plugin_ssr_loader_id = __commonJS({
+  "src/ssr/cli/babel-plugin-ssr-loader-id.ts"(exports, module) {
+    const RUNTIME_PACKAGE_NAMES = ["@modern-js/runtime"];
+    const FUNCTION_USE_LOADER_NAME = "useLoader";
+    function getHash(filepath) {
+      const cwd = process.cwd();
+      const point = filepath.indexOf(cwd);
+      let relativePath = filepath;
+      if (point !== -1) {
+        relativePath = filepath.substring(point + cwd.length);
+      }
+      const fileBuf = Buffer2.from(relativePath);
+      const fsHash = crypto.createHash("md5");
+      const md5 = fsHash.update(fileBuf).digest("hex");
+      return md5;
+    }
+    function getUseLoaderPath(path, calleeName) {
+      const { node } = path;
+      if (!calleeName || node.callee.name !== calleeName) {
+        return false;
+      }
+      const arg1 = get(node, "arguments.0");
+      if (t.isFunction(arg1) || t.isFunctionExpression(arg1) || t.isArrowFunctionExpression(arg1) || t.isIdentifier(arg1) || t.isCallExpression(arg1) || t.isMemberExpression(arg1)) {
+        const loaderPath = path.get("arguments.0");
+        if (isDuplicateInnerLoader(loaderPath)) {
+          return false;
+        } else {
+          return loaderPath;
+        }
+      }
+      console.warn("useLoader 中 loaderId 生成失败，请检查 useLoader");
+      throw path.buildCodeFrameError(`
+    please check the usage of ${path.node.name}
+  `);
+    }
+    function isDuplicateInnerLoader(path) {
+      const { node } = path;
+      if (t.isFunctionExpression(node.callee)) {
+        if (t.isBlockStatement(node.callee.body)) {
+          if (get(node.callee.body, "body.0.declarations.0.id.name") === "innerLoader" && get(node.callee.body, "body.2.argument.name") === "innerLoader") {
+            return true;
+          }
+        }
+      }
+      return false;
+    }
+    function getSelfRunLoaderExpression(loaderExpression, id) {
+      return t.callExpression(
+        t.functionExpression(
+          null,
+          [],
+          t.blockStatement([
+            t.variableDeclaration("var", [
+              t.variableDeclarator(t.identifier("innerLoader"), loaderExpression)
+            ]),
+            t.expressionStatement(
+              t.assignmentExpression(
+                "=",
+                t.memberExpression(t.identifier("innerLoader"), t.identifier("id")),
+                t.stringLiteral(id)
+              )
+            ),
+            t.returnStatement(t.identifier("innerLoader"))
+          ])
+        ),
+        []
+      );
+    }
+    module.exports = function() {
+      let useLoader = null;
+      let hash = "";
+      let index = 0;
+      function genId() {
+        return `${hash}_${index++}`;
+      }
+      return {
+        name: "babel-plugin-ssr-loader-id",
+        pre() {
+          index = 0;
+          useLoader = null;
+          hash = "";
+        },
+        visitor: {
+          ImportDeclaration(path, state) {
+            if (useLoader) {
+              return false;
+            }
+            if (!RUNTIME_PACKAGE_NAMES.includes(get(path, "node.source.value"))) {
+              return false;
+            }
+            hash = getHash(state.file.opts.filename);
+            get(path, "node.specifiers", []).forEach(({ imported, local }) => {
+              if (!imported) {
+                throw path.buildCodeFrameError(
+                  `please \`import { useLoader } from ${RUNTIME_PACKAGE_NAMES[0]}\``
+                );
+              }
+              if (!useLoader && imported.name === FUNCTION_USE_LOADER_NAME) {
+                useLoader = local.name;
+              }
+            });
+            return false;
+          },
+          CallExpression(path) {
+            let loaderPath = getUseLoaderPath(path, useLoader);
+            if (loaderPath) {
+              if (!Array.isArray(loaderPath)) {
+                loaderPath = [loaderPath];
+              }
+              loaderPath.forEach((p) => {
+                p.replaceWith(getSelfRunLoaderExpression(p.node, genId()));
+              });
+              return false;
+            }
+            return false;
+          }
+        }
+      };
+    };
+  }
+});
+export default require_babel_plugin_ssr_loader_id();

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

@@ -0,0 +1,172 @@
+var __defProp = Object.defineProperty;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp.call(b, prop))
+      __defNormalProp(a, prop, b[prop]);
+  if (__getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(b)) {
+      if (__propIsEnum.call(b, prop))
+        __defNormalProp(a, prop, b[prop]);
+    }
+  return a;
+};
+import path from "path";
+import {
+  getEntryOptions,
+  SERVER_RENDER_FUNCTION_NAME,
+  LOADABLE_STATS_FILE,
+  isUseSSRBundle,
+  createRuntimeExportsUtils,
+  isSingleEntry
+} from "@modern-js/utils";
+const PLUGIN_IDENTIFIER = "ssr";
+const hasStringSSREntry = (userConfig) => {
+  const isStreaming = (ssr) => ssr && typeof ssr === "object" && ssr.mode === "stream";
+  const { server } = userConfig;
+  if ((server == null ? void 0 : server.ssr) && !isStreaming(server.ssr)) {
+    return true;
+  }
+  if ((server == null ? void 0 : server.ssrByEntries) && typeof server.ssrByEntries === "object") {
+    for (const name of Object.keys(server.ssrByEntries)) {
+      if (!isStreaming(server.ssrByEntries[name])) {
+        return true;
+      }
+    }
+  }
+  return false;
+};
+var cli_default = () => ({
+  name: "@modern-js/plugin-ssr",
+  required: ["@modern-js/runtime"],
+  setup: (api) => {
+    const ssrConfigMap = /* @__PURE__ */ new Map();
+    let pluginsExportsUtils;
+    return {
+      config() {
+        const appContext = api.useAppContext();
+        pluginsExportsUtils = createRuntimeExportsUtils(
+          appContext.internalDirectory,
+          "plugins"
+        );
+        return {
+          source: {
+            alias: {
+              "@modern-js/runtime/plugins": pluginsExportsUtils.getPath()
+            }
+          },
+          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, [
+                  { filename: LOADABLE_STATS_FILE }
+                ]);
+              }
+              const modernVars = {
+                [`process.env.MODERN_TARGET`]: JSON.stringify(
+                  isServer || isServiceWorker ? "node" : "browser"
+                )
+              };
+              chain.plugin(CHAIN_ID.PLUGIN.DEFINE).tap((args) => {
+                const [vars, ...rest] = args;
+                return [
+                  __spreadValues(__spreadValues({}, vars), modernVars),
+                  ...rest
+                ];
+              });
+            },
+            babel: (config) => {
+              config.plugins.push(
+                path.join(__dirname, "./babel-plugin-ssr-loader-id")
+              );
+              const userConfig = api.useResolvedConfigContext();
+              if (isUseSSRBundle(userConfig) && hasStringSSREntry(userConfig)) {
+                config.plugins.push(require.resolve("@loadable/babel-plugin"));
+              }
+            }
+          }
+        };
+      },
+      modifyEntryImports({ entrypoint, imports }) {
+        var _a;
+        const { entryName, fileSystemRoutes } = entrypoint;
+        const userConfig = api.useResolvedConfigContext();
+        const { packageName, entrypoints } = api.useAppContext();
+        pluginsExportsUtils.addExport(
+          `export { default as ssr } from '@modern-js/runtime/ssr'`
+        );
+        const ssrConfig = getEntryOptions(
+          entryName,
+          userConfig.server.ssr,
+          userConfig.server.ssrByEntries,
+          packageName
+        );
+        if (typeof ssrConfig === "object" && ssrConfig.mode === "stream") {
+          const runtimeConfig = getEntryOptions(
+            entryName,
+            userConfig.runtime,
+            userConfig.runtimeByEntries,
+            packageName
+          );
+          if (((_a = runtimeConfig == null ? void 0 : runtimeConfig.router) == null ? void 0 : _a.mode) === "react-router-5") {
+            throw new Error(
+              `router v5 plugin doesn't support streaming SSR, check your config 'runtime.router'`
+            );
+          }
+          if (fileSystemRoutes && !entrypoint.nestedRoutesEntry) {
+            throw new Error(
+              `You should switch to file-system based router to support streaming SSR.`
+            );
+          }
+        }
+        const ssgConfig = userConfig.output.ssg;
+        const useSSG = isSingleEntry(entrypoints) ? Boolean(ssgConfig) : ssgConfig === true || typeof (ssgConfig == null ? void 0 : ssgConfig[0]) === "function" || Boolean(ssgConfig == null ? void 0 : ssgConfig[entryName]);
+        ssrConfigMap.set(entryName, ssrConfig || useSSG);
+        if (ssrConfig || useSSG) {
+          imports.push({
+            value: "@modern-js/runtime/plugins",
+            specifiers: [{ imported: PLUGIN_IDENTIFIER }]
+          });
+        }
+        return {
+          entrypoint,
+          imports
+        };
+      },
+      modifyEntryRuntimePlugins({ entrypoint, plugins }) {
+        if (ssrConfigMap.get(entrypoint.entryName)) {
+          plugins.push({
+            name: PLUGIN_IDENTIFIER,
+            options: JSON.stringify(ssrConfigMap.get(entrypoint.entryName))
+          });
+        }
+        return {
+          entrypoint,
+          plugins
+        };
+      },
+      modifyEntryExport({ entrypoint, exportStatement }) {
+        if (ssrConfigMap.get(entrypoint.entryName)) {
+          return {
+            entrypoint,
+            exportStatement: [
+              `export function ${SERVER_RENDER_FUNCTION_NAME}(context) {
+              return bootstrap(AppWrapper, context)
+            }`,
+              exportStatement
+            ].join("\n")
+          };
+        }
+        return { entrypoint, exportStatement };
+      }
+    };
+  }
+});
+export {
+  cli_default as default
+};

package/dist/js/modern/ssr/index.js

@@ -0,0 +1,159 @@
+var __defProp = Object.defineProperty;
+var __defProps = Object.defineProperties;
+var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp.call(b, prop))
+      __defNormalProp(a, prop, b[prop]);
+  if (__getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(b)) {
+      if (__propIsEnum.call(b, prop))
+        __defNormalProp(a, prop, b[prop]);
+    }
+  return a;
+};
+var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
+var __async = (__this, __arguments, generator) => {
+  return new Promise((resolve, reject) => {
+    var fulfilled = (value) => {
+      try {
+        step(generator.next(value));
+      } catch (e) {
+        reject(e);
+      }
+    };
+    var rejected = (value) => {
+      try {
+        step(generator.throw(value));
+      } catch (e) {
+        reject(e);
+      }
+    };
+    var step = (x) => x.done ? resolve(x.value) : Promise.resolve(x.value).then(fulfilled, rejected);
+    step((generator = generator.apply(__this, __arguments)).next());
+  });
+};
+import { jsx } from "react/jsx-runtime";
+import { loadableReady } from "@loadable/component";
+import hoistNonReactStatics from "hoist-non-react-statics";
+import {
+  RenderLevel
+} from "./serverRender/types";
+import { WithCallback } from "./react/withCallback";
+import { formatClient, mockResponse, isReact18 } from "./utils";
+const ssr = (config) => ({
+  name: "@modern-js/plugin-ssr",
+  setup: () => {
+    const mockResp = mockResponse();
+    return {
+      client: (_0) => __async(void 0, [_0], function* ({ App, context, ModernRender, ModernHydrate }) {
+        var _a;
+        const hydrateContext = __spreadProps(__spreadValues({}, context), {
+          _hydration: true
+        });
+        const callback = () => {
+          delete hydrateContext._hydration;
+        };
+        const renderLevel = ((_a = window == null ? void 0 : window._SSR_DATA) == null ? void 0 : _a.renderLevel) || RenderLevel.CLIENT_RENDER;
+        if (isReact18() && config.mode === "stream") {
+          return streamSSRHydrate();
+        }
+        return stringSSRHydrate();
+        function stringSSRHydrate() {
+          if (renderLevel === RenderLevel.CLIENT_RENDER || renderLevel === RenderLevel.SERVER_PREFETCH) {
+            ModernRender(/* @__PURE__ */ jsx(App, {
+              context
+            }));
+          } else if (renderLevel === RenderLevel.SERVER_RENDER) {
+            if (isReact18()) {
+              loadableReady(() => {
+                let SSRApp = () => /* @__PURE__ */ jsx(WithCallback, {
+                  callback,
+                  children: /* @__PURE__ */ jsx(App, {
+                    context: hydrateContext
+                  })
+                });
+                SSRApp = hoistNonReactStatics(SSRApp, App);
+                ModernHydrate(/* @__PURE__ */ jsx(SSRApp, {}));
+              });
+            } else {
+              loadableReady(() => {
+                ModernHydrate(/* @__PURE__ */ jsx(App, {
+                  context: hydrateContext
+                }), callback);
+              });
+            }
+          } else {
+            console.warn(
+              `unknow render level: ${renderLevel}, execute render()`
+            );
+            ModernRender(/* @__PURE__ */ jsx(App, {
+              context
+            }));
+          }
+        }
+        function streamSSRHydrate() {
+          if (renderLevel === RenderLevel.SERVER_RENDER) {
+            let SSRApp = () => /* @__PURE__ */ jsx(WithCallback, {
+              callback,
+              children: /* @__PURE__ */ jsx(App, {
+                context: hydrateContext
+              })
+            });
+            SSRApp = hoistNonReactStatics(SSRApp, App);
+            ModernHydrate(/* @__PURE__ */ jsx(SSRApp, {}));
+          } else {
+            ModernRender(/* @__PURE__ */ jsx(App, {
+              context
+            }));
+          }
+        }
+      }),
+      init({ context }, next) {
+        var _a, _b;
+        const request = (_b = (_a = window == null ? void 0 : window._SSR_DATA) == null ? void 0 : _a.context) == null ? void 0 : _b.request;
+        if (!request) {
+          context.ssrContext = __spreadProps(__spreadValues({}, context.ssrContext), {
+            response: mockResp,
+            request: formatClient({})
+          });
+          return next({ context });
+        }
+        context.ssrContext.response = mockResp;
+        context.ssrContext.request = formatClient(request);
+        return next({ context });
+      },
+      pickContext: ({ context, pickedContext }, next) => {
+        var _a, _b;
+        const request = (_b = (_a = window == null ? void 0 : window._SSR_DATA) == null ? void 0 : _a.context) == null ? void 0 : _b.request;
+        const { initialData } = context;
+        if (!request) {
+          return next({
+            context,
+            pickedContext: __spreadProps(__spreadValues({}, pickedContext), {
+              initialData
+            })
+          });
+        }
+        return next({
+          context,
+          pickedContext: __spreadProps(__spreadValues({}, pickedContext), {
+            initialData,
+            request,
+            response: mockResp
+          })
+        });
+      }
+    };
+  }
+});
+var ssr_default = ssr;
+export * from "./react";
+export {
+  ssr_default as default,
+  ssr
+};

package/dist/js/modern/ssr/index.node.js

@@ -0,0 +1,79 @@
+var __defProp = Object.defineProperty;
+var __defProps = Object.defineProperties;
+var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp.call(b, prop))
+      __defNormalProp(a, prop, b[prop]);
+  if (__getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(b)) {
+      if (__propIsEnum.call(b, prop))
+        __defNormalProp(a, prop, b[prop]);
+    }
+  return a;
+};
+var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
+var __async = (__this, __arguments, generator) => {
+  return new Promise((resolve, reject) => {
+    var fulfilled = (value) => {
+      try {
+        step(generator.next(value));
+      } catch (e) {
+        reject(e);
+      }
+    };
+    var rejected = (value) => {
+      try {
+        step(generator.throw(value));
+      } catch (e) {
+        reject(e);
+      }
+    };
+    var step = (x) => x.done ? resolve(x.value) : Promise.resolve(x.value).then(fulfilled, rejected);
+    step((generator = generator.apply(__this, __arguments)).next());
+  });
+};
+import { formatServer } from "./utils";
+import render from "./serverRender";
+const ssr = (config = {}) => ({
+  name: "@modern-js/plugin-ssr",
+  setup: () => {
+    return {
+      server: (_0) => __async(void 0, [_0], function* ({ App, context }) {
+        const html = yield render({
+          context,
+          App,
+          config
+        });
+        return html;
+      }),
+      init({ context }, next) {
+        const { request } = context.ssrContext;
+        context.ssrContext.request = formatServer(request);
+        return next({ context });
+      },
+      pickContext: ({ context, pickedContext }, next) => {
+        const { request, response } = context == null ? void 0 : context.ssrContext;
+        const { initialData } = context;
+        return next({
+          context,
+          pickedContext: __spreadProps(__spreadValues({}, pickedContext), {
+            initialData,
+            request,
+            response
+          })
+        });
+      }
+    };
+  }
+});
+var index_node_default = ssr;
+export * from "./react";
+export {
+  index_node_default as default,
+  ssr
+};

package/dist/js/modern/ssr/prefetch.js

@@ -0,0 +1,69 @@
+var __async = (__this, __arguments, generator) => {
+  return new Promise((resolve, reject) => {
+    var fulfilled = (value) => {
+      try {
+        step(generator.next(value));
+      } catch (e) {
+        reject(e);
+      }
+    };
+    var rejected = (value) => {
+      try {
+        step(generator.throw(value));
+      } catch (e) {
+        reject(e);
+      }
+    };
+    var step = (x) => x.done ? resolve(x.value) : Promise.resolve(x.value).then(fulfilled, rejected);
+    step((generator = generator.apply(__this, __arguments)).next());
+  });
+};
+import { jsx } from "react/jsx-runtime";
+import { renderToStaticMarkup } from "react-dom/server";
+import { run } from "@modern-js/utils/ssr";
+import { ChunkExtractor } from "@loadable/server";
+const prefetch = (App, context) => __async(void 0, null, function* () {
+  return run(context.ssrContext.request.headers, () => __async(void 0, null, function* () {
+    var _a;
+    const { ssrContext } = context;
+    const { loadableStats } = ssrContext;
+    if (loadableStats) {
+      const extractor = new ChunkExtractor({
+        stats: loadableStats,
+        entrypoints: [ssrContext.entryName].filter(Boolean)
+      });
+      renderToStaticMarkup(extractor.collectChunks(/* @__PURE__ */ jsx(App, {
+        context
+      })));
+    } else {
+      renderToStaticMarkup(/* @__PURE__ */ jsx(App, {
+        context
+      }));
+    }
+    if (!context.loaderManager.hasPendingLoaders()) {
+      return {
+        initialData: context.initialData,
+        i18nData: context.__i18nData__
+      };
+    }
+    const loadersData = yield context.loaderManager.awaitPendingLoaders();
+    Object.keys(loadersData).forEach((id) => {
+      const data = loadersData[id];
+      if (data._error) {
+        ssrContext.logger.error("App Prefetch Loader", data._error);
+        ssrContext.metrics.emitCounter("app.prefetch.loader.error", 1);
+        delete data._error;
+      }
+    });
+    return {
+      loadersData,
+      initialData: context.initialData,
+      i18nData: context.__i18nData__,
+      storeState: (_a = context == null ? void 0 : context.store) == null ? void 0 : _a.getState()
+    };
+  }));
+});
+var prefetch_default = prefetch;
+export {
+  prefetch_default as default
+};