@modern-js/app-tools 1.21.5 → 2.0.0-beta.1

package/dist/js/modern/analyze/getServerRoutes.js

@@ -1,27 +1,21 @@
 const _excluded = ["path"],
-      _excluded2 = ["path"];
-
+  _excluded2 = ["path"];
 function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
-
 function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
-
 function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
-
 function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
-
 function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
-
 import path from 'path';
 import fs from 'fs';
 import { urlJoin, isPlainObject, removeLeadingSlash, getEntryOptions, SERVER_BUNDLE_DIRECTORY, MAIN_ENTRY_NAME, removeTailSlash } from '@modern-js/utils';
 import { walkDirectory } from "./utils";
+
 /**
  * Add base url for each server route.
  * @param baseUrl - Base url from server.baseUrl
  * @param routes - Server routes.
  * @returns Server routes with baseUrl prefixed.
  */
-
 const applyBaseUrl = (baseUrl, routes) => {
   if (baseUrl) {
     if (Array.isArray(baseUrl)) {
@@ -35,37 +29,34 @@ const applyBaseUrl = (baseUrl, routes) => {
       });
     }
   }
-
   return routes;
 };
+
 /**
  *
  * @param original - Original entrypoint route info.
  * @param routeOptions - Custom entrypoint route config from server.routes.
  * @returns
  */
-
-
 const applyRouteOptions = (original, routeOptions) => {
   const {
     route,
     disableSpa
   } = routeOptions;
-  original.isSPA = !disableSpa; // set entryPath as dir
+  original.isSPA = !disableSpa;
 
+  // set entryPath as dir
   !original.isSPA && (original.entryPath = path.dirname(original.entryPath));
   let routes;
-
   if (route) {
     if (Array.isArray(route)) {
       routes = route.map(url => {
         if (isPlainObject(url)) {
           const _ref = url,
-                {
-            path: urlPath
-          } = _ref,
-                other = _objectWithoutProperties(_ref, _excluded);
-
+            {
+              path: urlPath
+            } = _ref,
+            other = _objectWithoutProperties(_ref, _excluded);
           return _objectSpread(_objectSpread(_objectSpread({}, original), other), {}, {
             urlPath
           });
@@ -77,11 +68,10 @@ const applyRouteOptions = (original, routeOptions) => {
       });
     } else if (isPlainObject(route)) {
       const _ref2 = route,
-            {
-        path: urlPath
-      } = _ref2,
-            other = _objectWithoutProperties(_ref2, _excluded2);
-
+        {
+          path: urlPath
+        } = _ref2,
+        other = _objectWithoutProperties(_ref2, _excluded2);
       routes = [_objectSpread(_objectSpread(_objectSpread({}, original), other), {}, {
         urlPath
       })];
@@ -93,17 +83,15 @@ const applyRouteOptions = (original, routeOptions) => {
   } else {
     routes = [original];
   }
-
   return routes;
 };
+
 /**
  * Collect routes from entrypoints.
  * @param entrypoints - Bundle entrypoints.
  * @param config - Normalized user config.
  * @returns entrypoint Routes
  */
-
-
 const collectHtmlRoutes = (entrypoints, appContext, config) => {
   const {
     output: {
@@ -139,27 +127,24 @@ const collectHtmlRoutes = (entrypoints, appContext, config) => {
       enableModernMode: Boolean(enableModernMode),
       bundle: isSSR ? `${SERVER_BUNDLE_DIRECTORY}/${entryName}.js` : undefined
     };
-
     if (routes !== null && routes !== void 0 && routes.hasOwnProperty(entryName)) {
       const routeOptions = isPlainObject(routes[entryName]) ? routes[entryName] : {
         route: routes[entryName]
       };
       route = applyRouteOptions(route, routeOptions);
     }
-
     return Array.isArray(route) ? [...previous, ...route] : [...previous, route];
   }, []);
   htmlRoutes = applyBaseUrl(baseUrl, htmlRoutes);
   return htmlRoutes;
 };
+
 /**
  * Collect static public file routes from config/public folder.
  * @param appContext - App context info.
  * @param config - normalized user config.
  * @returns Static public file routes.
  */
-
-
 const collectStaticRoutes = (appContext, config) => {
   const {
     appDirectory
@@ -183,10 +168,8 @@ const collectStaticRoutes = (appContext, config) => {
     };
   }) : [];
 };
-
 export const getServerRoutes = (entrypoints, {
   appContext,
   config
 }) => [...collectHtmlRoutes(entrypoints, appContext, config), ...collectStaticRoutes(appContext, config)];
-
 const toPosix = pathStr => pathStr.split(path.sep).join(path.posix.sep);

package/dist/js/modern/analyze/index.js

@@ -1,13 +1,15 @@
 function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
-
 function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
-
 function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
-
 import * as path from 'path';
 import { createAsyncWaterfall } from '@modern-js/plugin';
 import { createDebugger, fs, isApiOnly } from '@modern-js/utils';
 import { cloneDeep } from '@modern-js/utils/lodash';
+import { createBuilderForEdenX } from "../builder";
+import { printInstructions } from "../utils/printInstructions";
+import { generateRoutes } from "../utils/routes";
+import { emitResolvedConfig } from "../utils/config";
+import { getCommand } from "../utils/commands";
 import { isRouteComponentFile } from "./utils";
 const debug = createDebugger('plugin-analyze');
 export const modifyEntryImports = createAsyncWaterfall();
@@ -42,19 +44,16 @@ export default (() => ({
     return {
       async prepare() {
         var _resolvedConfig$sourc;
-
-        const appContext = api.useAppContext();
+        let appContext = api.useAppContext();
         const resolvedConfig = api.useResolvedConfigContext();
         const hookRunners = api.useHookRunners();
-
         try {
           fs.emptydirSync(appContext.internalDirectory);
-        } catch (_unused) {// FIXME:
+        } catch (_unused) {
+          // FIXME:
         }
-
         const apiOnly = await isApiOnly(appContext.appDirectory, resolvedConfig === null || resolvedConfig === void 0 ? void 0 : (_resolvedConfig$sourc = resolvedConfig.source) === null || _resolvedConfig$sourc === void 0 ? void 0 : _resolvedConfig$sourc.entriesDir);
         await hookRunners.addRuntimeExports();
-
         if (apiOnly) {
           const {
             routes
@@ -62,13 +61,13 @@ export default (() => ({
             routes: []
           });
           debug(`server routes: %o`, routes);
-          api.setAppContext(_objectSpread(_objectSpread({}, appContext), {}, {
+          appContext = _objectSpread(_objectSpread({}, appContext), {}, {
             apiOnly,
             serverRoutes: routes
-          }));
+          });
+          api.setAppContext(appContext);
           return;
         }
-
         const [{
           getBundleEntry
         }, {
@@ -91,11 +90,13 @@ export default (() => ({
           routes: initialRoutes
         });
         debug(`server routes: %o`, routes);
-        api.setAppContext(_objectSpread(_objectSpread({}, appContext), {}, {
+        appContext = _objectSpread(_objectSpread({}, appContext), {}, {
           entrypoints,
           serverRoutes: routes
-        }));
-        pagesDir = entrypoints.map(point => point.entry);
+        });
+        api.setAppContext(appContext);
+        const nestedRouteEntries = entrypoints.map(point => point.nestedRoutesEntry).filter(Boolean);
+        pagesDir = entrypoints.map(point => point.entry).filter(Boolean).concat(nestedRouteEntries);
         originEntrypoints = cloneDeep(entrypoints);
         await generateCode(appContext, resolvedConfig, entrypoints, api);
         const htmlTemplates = await getHtmlTemplate(entrypoints, api, {
@@ -105,19 +106,80 @@ export default (() => ({
         debug(`html templates: %o`, htmlTemplates);
         await hookRunners.addDefineTypes();
         debug(`add Define Types`);
-        api.setAppContext(_objectSpread(_objectSpread({}, appContext), {}, {
+        appContext = _objectSpread(_objectSpread({}, appContext), {}, {
           entrypoints,
           checkedEntries: defaultChecked,
           apiOnly,
           serverRoutes: routes,
           htmlTemplates
-        }));
+        });
+        api.setAppContext(appContext);
+        const command = getCommand();
+        const buildCommands = ['dev', 'build', 'inspect', 'deploy'];
+        if (buildCommands.includes(command)) {
+          const normalizedConfig = api.useResolvedConfigContext();
+          const builder = await createBuilderForEdenX({
+            normalizedConfig,
+            appContext,
+            compatPluginConfig: {
+              async onBeforeBuild({
+                bundlerConfigs
+              }) {
+                const hookRunners = api.useHookRunners();
+                await generateRoutes(appContext);
+                await hookRunners.beforeBuild({
+                  bundlerConfigs
+                });
+              },
+              async onAfterBuild({
+                stats
+              }) {
+                const hookRunners = api.useHookRunners();
+                await hookRunners.afterBuild({
+                  stats
+                });
+                await emitResolvedConfig(appContext.appDirectory, normalizedConfig);
+              },
+              async onDevCompileDone({
+                isFirstCompile
+              }) {
+                const hookRunners = api.useHookRunners();
+                if (process.stdout.isTTY || isFirstCompile) {
+                  hookRunners.afterDev();
+                  if (isFirstCompile) {
+                    printInstructions(hookRunners, appContext, normalizedConfig);
+                  }
+                }
+              },
+              async onBeforeCreateCompiler({
+                bundlerConfigs
+              }) {
+                const hookRunners = api.useHookRunners();
+                // run modernjs framework `beforeCreateCompiler` hook
+                await hookRunners.beforeCreateCompiler({
+                  bundlerConfigs
+                });
+              },
+              async onAfterCreateCompiler({
+                compiler
+              }) {
+                const hookRunners = api.useHookRunners();
+                // run modernjs framework afterCreateCompiler hooks
+                await hookRunners.afterCreateCompiler({
+                  compiler
+                });
+              }
+            }
+          });
+          appContext = _objectSpread(_objectSpread({}, appContext), {}, {
+            builder
+          });
+          api.setAppContext(appContext);
+        }
       },
-
       watchFiles() {
         return pagesDir;
       },
-
       async fileChange(e) {
         const appContext = api.useAppContext();
         const {
@@ -127,12 +189,9 @@ export default (() => ({
           filename,
           eventType
         } = e;
-
         const isPageFile = name => pagesDir.some(pageDir => name.includes(pageDir));
-
         const absoluteFilePath = path.resolve(appDirectory, filename);
         const isRouteComponent = isPageFile(absoluteFilePath) && isRouteComponentFile(absoluteFilePath);
-
         if (isRouteComponent && (eventType === 'add' || eventType === 'unlink')) {
           const resolvedConfig = api.useResolvedConfigContext();
           const {
@@ -142,7 +201,6 @@ export default (() => ({
           generateCode(appContext, resolvedConfig, entrypoints, api);
         }
       }
-
     };
   }
 }));

package/dist/js/modern/analyze/isDefaultExportFunction.js

@@ -2,14 +2,11 @@ import fs from 'fs';
 import { parse } from '@babel/parser';
 import traverse from '@babel/traverse';
 import * as t from '@babel/types';
-
 const isFunction = node => t.isFunctionDeclaration(node) || t.isFunctionExpression(node) || t.isArrowFunctionExpression(node);
-
 export const isDefaultExportFunction = file => {
   if (!file || !fs.existsSync(file)) {
     return false;
   }
-
   const ast = parse(fs.readFileSync(file, 'utf8'), {
     sourceType: 'unambiguous',
     plugins: ['jsx', 'typescript', 'classProperties', 'dynamicImport', 'exportDefaultFrom', 'exportNamespaceFrom', 'decorators-legacy', 'functionBind', 'classPrivateMethods', ['pipelineOperator', {
@@ -22,7 +19,6 @@ export const isDefaultExportFunction = file => {
       const {
         declaration
       } = path.node;
-
       if (isFunction(declaration)) {
         isExportFunction = true;
       }

package/dist/js/modern/analyze/makeLegalIdentifier.js

@@ -7,10 +7,8 @@ const builtins = 'arguments Infinity NaN undefined null true false eval uneval i
 const forbidList = new Set(`${reservedWords} ${builtins}`.split(' '));
 export function makeLegalIdentifier(str) {
   const identifier = str.replace(/-(\w)/g, (_, letter) => letter.toUpperCase()).replace(/[^$_a-zA-Z0-9]/g, '_');
-
   if (/\d/.test(identifier[0]) || forbidList.has(identifier)) {
     return `_${identifier}`;
   }
-
   return identifier || '_';
 }

package/dist/js/modern/analyze/nestedRoutes.js

@@ -0,0 +1,102 @@
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+import * as path from 'path';
+import { fs, getRouteId } from '@modern-js/utils';
+import { JS_EXTENSIONS } from "./constants";
+import { replaceWithAlias } from "./utils";
+const LAYOUT_FILE = 'layout';
+const PAGE_FILE = 'page';
+const LOADING_FILE = 'loading';
+const ERROR_FILE = 'error';
+const LOADER_FILE = 'loader';
+const conventionNames = [LAYOUT_FILE, PAGE_FILE, LOADING_FILE, ERROR_FILE, LOADER_FILE];
+const replaceDynamicPath = routePath => {
+  return routePath.replace(/\[(.*?)\]/g, ':$1');
+};
+const createIndexRoute = (routeInfo, rootDir, filename, entryName) => {
+  return createRoute(_objectSpread(_objectSpread({}, routeInfo), {}, {
+    index: true,
+    children: undefined
+  }), rootDir, filename, entryName);
+};
+const createRoute = (routeInfo, rootDir, filename, entryName) => {
+  const id = getRouteId(filename, rootDir, entryName);
+  return _objectSpread(_objectSpread({}, routeInfo), {}, {
+    id,
+    type: 'nested'
+  });
+};
+export const walk = async (dirname, rootDir, alias, entryName) => {
+  if (!(await fs.pathExists(dirname))) {
+    return null;
+  }
+  const isDirectory = (await fs.stat(dirname)).isDirectory();
+  if (!isDirectory) {
+    return null;
+  }
+  const relativeDir = path.relative(rootDir, dirname);
+  const pathSegments = relativeDir.split(path.sep);
+  const lastSegment = pathSegments[pathSegments.length - 1];
+  const isRoot = lastSegment === '';
+  const isPathlessLayout = lastSegment.startsWith('__');
+  const isWithoutLayoutPath = lastSegment.includes('.');
+  let routePath = isRoot || isPathlessLayout ? '/' : `${lastSegment}`;
+  if (isWithoutLayoutPath) {
+    routePath = lastSegment.split('.').join('/');
+  }
+  routePath = replaceDynamicPath(routePath);
+  const route = {
+    path: routePath,
+    children: []
+  };
+  const items = await fs.readdir(dirname);
+  for (const item of items) {
+    const itemPath = path.join(dirname, item);
+    const extname = path.extname(item);
+    const itemWithoutExt = item.slice(0, -extname.length);
+    const isDirectory = (await fs.stat(itemPath)).isDirectory();
+    if (isDirectory) {
+      const childRoute = await walk(itemPath, rootDir, alias, entryName);
+      if (childRoute) {
+        var _route$children;
+        (_route$children = route.children) === null || _route$children === void 0 ? void 0 : _route$children.push(childRoute);
+      }
+    }
+    if (extname && (!JS_EXTENSIONS.includes(extname) || !conventionNames.includes(itemWithoutExt))) {
+      continue;
+    }
+    if (itemWithoutExt === LAYOUT_FILE) {
+      route._component = replaceWithAlias(alias.basename, itemPath, alias.name);
+    }
+    if (itemWithoutExt === PAGE_FILE) {
+      var _route$children2;
+      const childRoute = createIndexRoute({
+        _component: replaceWithAlias(alias.basename, itemPath, alias.name)
+      }, rootDir, itemPath, entryName);
+      (_route$children2 = route.children) === null || _route$children2 === void 0 ? void 0 : _route$children2.push(childRoute);
+    }
+    if (itemWithoutExt === LOADER_FILE) {
+      route.loader = replaceWithAlias(alias.basename, itemPath, alias.name);
+    }
+    if (itemWithoutExt === LOADING_FILE) {
+      route.loading = replaceWithAlias(alias.basename, itemPath, alias.name);
+    }
+    if (itemWithoutExt === ERROR_FILE) {
+      route.error = replaceWithAlias(alias.basename, itemPath, alias.name);
+    }
+  }
+  const finalRoute = createRoute(route, rootDir, path.join(dirname, `${LAYOUT_FILE}.ts`), entryName);
+
+  /**
+   * when the url is /, the __auth/layout.tsx component should not be rendered
+   * - routes
+   *  - __auth
+   *    - layout.tsx
+   *  - layout.tsx
+   */
+  if (isPathlessLayout) {
+    delete finalRoute.path;
+  }
+  return finalRoute;
+};

package/dist/js/modern/analyze/templates.js

@@ -1,3 +1,6 @@
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
 export const index = ({
   mountId,
   imports,
@@ -73,16 +76,152 @@ export const html = partials => `
 
 </html>
 `;
+export const routesForServer = ({
+  routes,
+  alias
+}) => {
+  const {
+    name,
+    basename
+  } = alias;
+  const loaders = [];
+  const traverseRouteTree = route => {
+    let children;
+    if ('children' in route && route.children) {
+      var _route$children;
+      children = route === null || route === void 0 ? void 0 : (_route$children = route.children) === null || _route$children === void 0 ? void 0 : _route$children.map(traverseRouteTree);
+    }
+    let loader;
+    if (route.type === 'nested') {
+      if (route.loader) {
+        loaders.push(route.loader);
+        loader = `loader_${loaders.length - 1}`;
+      }
+    }
+    const finalRoute = _objectSpread(_objectSpread({}, route), {}, {
+      loader,
+      children
+    });
+    return finalRoute;
+  };
+  let routesCode = `
+  export const routes = [
+  `;
+  for (const route of routes) {
+    if ('type' in route) {
+      const newRoute = traverseRouteTree(route);
+      routesCode += `${JSON.stringify(newRoute, null, 2).replace(/"(loader_[^"])"/g, '$1')},`;
+    } else {
+      routesCode += `${JSON.stringify(route, null, 2)}`;
+    }
+  }
+  routesCode += `\n];`;
+  const importLoadersCode = loaders.map((loader, index) => {
+    const realLoaderPath = loader.replace(name, basename);
+    return `import loader_${index} from '${realLoaderPath}';\n`;
+  }).join('');
+  return `
+    ${importLoadersCode}
+    ${routesCode}
+  `;
+};
 export const fileSystemRoutes = ({
-  routes
-}) => `
-import loadable from '@modern-js/runtime/loadable';
-
-${routes.map(({
-  component,
-  _component
-}) => `const ${component} = loadable(() => import('${_component}'));`).join('\n\n')}
-
-
-export const routes = ${JSON.stringify(routes, null, 2).replace(/"component"\s*:\s*"(\S+)"/g, '"component": $1')}
-`;
+  routes,
+  ssrMode,
+  nestedRoutesEntry,
+  entryName
+}) => {
+  // The legacy mode and pages dir routes should use loadable
+  // nested routes + renderTostring should use loadable.lazy
+  // nested routes + renderToStream should use react.lazy
+  const importLazyCode = `
+    import { lazy } from "react";
+    import loadable, { lazy as loadableLazy } from "@modern-js/runtime/loadable"
+  `;
+  let dataLoaderPath = '';
+  if (ssrMode) {
+    dataLoaderPath = require.resolve(`@modern-js/plugin-data-loader/loader`);
+    if (nestedRoutesEntry) {
+      dataLoaderPath = `${dataLoaderPath}?routesDir=${nestedRoutesEntry}&entryName=${entryName}!`;
+    }
+  }
+  const loadings = [];
+  const errors = [];
+  const loaders = [];
+  const traverseRouteTree = route => {
+    let children;
+    if ('children' in route && route.children) {
+      var _route$children2;
+      children = route === null || route === void 0 ? void 0 : (_route$children2 = route.children) === null || _route$children2 === void 0 ? void 0 : _route$children2.map(traverseRouteTree);
+    }
+    let loading;
+    let error;
+    let loader;
+    let component = '';
+    if (route.type === 'nested') {
+      if (route.loading) {
+        loadings.push(route.loading);
+        loading = `loading_${loadings.length - 1}`;
+      }
+      if (route.error) {
+        errors.push(route.error);
+        error = `error_${errors.length - 1}`;
+      }
+      if (route.loader) {
+        loaders.push(route.loader);
+        loader = `loader_${loaders.length - 1}`;
+      }
+      if (route._component) {
+        if (ssrMode === 'stream') {
+          component = `lazy(() => import(/* webpackChunkName: "${route.id}" */  /* webpackMode: "lazy-once" */ '${route._component}'))`;
+        } else {
+          component = `loadable(() => import(/* webpackChunkName: "${route.id}" */  /* webpackMode: "lazy-once" */ '${route._component}'))`;
+        }
+      }
+    } else if (route._component) {
+      component = `loadable(() => import('${route._component}'))`;
+    }
+    const finalRoute = _objectSpread(_objectSpread({}, route), {}, {
+      loading,
+      loader,
+      error,
+      children
+    });
+    if (route._component) {
+      finalRoute.component = component;
+    }
+    return finalRoute;
+  };
+  let routeComponentsCode = `
+    export const routes = [
+  `;
+  for (const route of routes) {
+    if ('type' in route) {
+      const newRoute = traverseRouteTree(route);
+      routeComponentsCode += `${JSON.stringify(newRoute, null, 2).replace(/"(loadable.*\))"/g, '$1').replace(/"(loadableLazy.*\))"/g, '$1').replace(/"(lazy.*\))"/g, '$1').replace(/"(loading_[^"])"/g, '$1').replace(/"(loader_[^"])"/g, '$1').replace(/"(error_[^"])"/g, '$1').replace(/\\"/g, '"')},`;
+    } else {
+      const component = `loadable(() => import('${route._component}'))`;
+      const finalRoute = _objectSpread(_objectSpread({}, route), {}, {
+        component
+      });
+      routeComponentsCode += `${JSON.stringify(finalRoute, null, 2).replace(/"(loadable[^"]*)"/g, '$1').replace(/"(lazy[^"]*)"/g, '$1')},`;
+    }
+  }
+  routeComponentsCode += `\n];`;
+  const importLoadingCode = loadings.map((loading, index) => {
+    return `import loading_${index} from '${loading}';\n`;
+  }).join('');
+  const importErrorComponentsCode = errors.map((error, index) => {
+    return `import error_${index} from '${error}';\n`;
+  }).join('');
+  const importLoaderComponentsCode = loaders.map((loader, index) => {
+    return `import loader_${index} from '${dataLoaderPath}${loader}';\n`;
+  }).join('');
+  return `
+    ${importLazyCode}
+    ${importLoadingCode}
+    ${importErrorComponentsCode}
+    ${importLoaderComponentsCode}
+    ${routeComponentsCode}
+  `;
+};