@modern-js/runtime 2.0.0-beta.1 → 2.0.0-beta.2

package/CHANGELOG.md

@@ -1,5 +1,86 @@
 # @modern-js/runtime
 
+## 2.0.0-beta.2
+
+### Major Changes
+
+- dda38c9c3e: chore: v2
+
+### Minor Changes
+
+- c9e800d39a: feat: support React18 streaming SSR
+  feat: 支持 React18 流式 SSR
+- 543be9558e: feat: compile server loader and support handle loader request
+  feat: 编译 server loader 并支持处理 loader 的请求
+
+### Patch Changes
+
+- 2344eb2: fix: bootstrap function params type define
+
+  fix: 修复 bootstrap 函数参数类型定义
+
+- a11fcf8: feat: fallback logic of streaming ssr
+  feat: streaming ssr 降级逻辑
+- b18fa8f3ed: feat: remove @loadable/component in streaming ssr
+  feat: 移除 streaming ssr 中的 @loadable/component 逻辑
+- 3e57f2b: feat: add document feature with plugin
+
+  feat: 增加 document 功能插件
+
+- fbf5eed: fix: fix ssg failure due to lack of Web Response API
+  fix: 修复因为缺少 Web Response API 而导致 ssg 失败
+- a2509bfbdb: feat: bump esbuild from 0.14.38 to 0.15.7
+
+  feat: 将 esbuild 从 0.14.38 版本升级至 0.15.7 版本
+
+- e4357f1: fix: change default document file and name
+
+  fix: 重置默认的 document 文件和文件名
+
+- 4369648ae2: fix: fix html template of streaming ssr
+  fix: 修复流式渲染的 html 模版
+- 92c0994: chore: remove `registerPrefetch`
+  chore: 移除 `registerPrefetch`
+- 6bda14ed71: feat: refactor router with react-router@6.4
+
+  feat: 使用 react-router@6.4 重构路由模块
+
+- 92004d1: feat: support load chunks parallelly
+  feat: 支持并行加载 chunks
+- 40ed587: feat: inject css chunk into html for streaming ssr
+  feat: streaming ssr 返回的 html 注入 css chunk
+- 60d5378632: fix: function extname should not return array
+  fix: 函数 extname 不应该返回一个数组
+- 8b8e1bb571: feat: support nested routes
+  feat: 支持嵌套路由
+- 3bbea92b2a: feat: support Hook、Middleware new API
+  feat: 支持 Hook、Middleware 的新 API
+- 18aaf42: fix: fix server loader redirects
+  fix: 修复 server loader 重定向错误
+- fcace5b5b9: fix: remove overmuch `@modernjs/utils` dependency import in ssr runtime & SSR hydrate error
+  fix: 去除 ssr 运行时过多的 `@modernjs/utils` 依赖引入 & SSR hydrate 错误
+- Updated dependencies [92f0ead]
+- Updated dependencies [edd1cfb1af]
+- Updated dependencies [cc971eabfc]
+- Updated dependencies [5b9049f2e9]
+- Updated dependencies [6bda14ed71]
+- Updated dependencies [92004d1]
+- Updated dependencies [b8bbe036c7]
+- Updated dependencies [40ed587]
+- Updated dependencies [87c1ff8]
+- Updated dependencies [d5a31df781]
+- Updated dependencies [dda38c9c3e]
+- Updated dependencies [102d32e4ba]
+- Updated dependencies [8b8e1bb571]
+- Updated dependencies [3bbea92b2a]
+- Updated dependencies [f179749]
+- Updated dependencies [abf3421a75]
+- Updated dependencies [543be9558e]
+- Updated dependencies [14b712da84]
+  - @modern-js/utils@2.0.0-beta.2
+  - @modern-js/types@2.0.0-beta.2
+  - @modern-js/plugin@2.0.0-beta.2
+
 ## 2.0.0-beta.1
 
 ### Major Changes

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

@@ -25,7 +25,9 @@ export default (() => ({
                */
               'styled-components': require.resolve('styled-components')
             },
-            envVars: ['IS_REACT18']
+            globalVars: {
+              'process.env.IS_REACT18': process.env.IS_REACT18
+            }
           }
         };
       },

package/dist/js/modern/core/compatible.js

@@ -5,7 +5,6 @@ function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (O
 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 React, { useContext, useMemo } from 'react';
-import defaultReactDOM from 'react-dom';
 import hoistNonReactStatics from 'hoist-non-react-statics';
 import { RuntimeReactContext } from "../runtime-context";
 import { runtime } from "./plugin";
@@ -95,7 +94,7 @@ id,
 /**
  * root.render need use root to run function
  */
-root, ReactDOM = defaultReactDOM
+root, ReactDOM
 // eslint-disable-next-line consistent-return
 ) => {
   let App = BootApp;
@@ -153,7 +152,9 @@ root, ReactDOM = defaultReactDOM
         context.initialData = initialData;
       }
       const rootElement = typeof id !== 'string' ? id : document.getElementById(id || 'root');
-
+      if (!ReactDOM) {
+        throw Error('The `bootstrap` need provide `ReactDOM` parameter');
+      }
       // https://reactjs.org/blog/2022/03/08/react-18-upgrade-guide.html
       const ModernRender = App => {
         if (IS_REACT18) {

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

@@ -9,10 +9,15 @@ import { createDebugger, findExists } from '@modern-js/utils';
 import { DocumentContext } from "../DocumentContext";
 import { DOCUMENT_SCRIPTS_PLACEHOLDER, DOCUMENT_FILE_NAME, DOCUMENT_META_PLACEHOLDER, PLACEHOLDER_REPLACER_MAP, DOC_EXT, DOCUMENT_SSR_PLACEHOLDER, DOCUMENT_CHUNKSMAP_PLACEHOLDER, DOCUMENT_SSRDATASCRIPT_PLACEHOLDER, HTML_SEPARATOR } from "../constants";
 const debug = createDebugger('html_genarate');
-const getDocumenByEntryName = function getDocumenByEntryName(entrypoints, entryName) {
+
+// get the entry document file,
+// if not exist, fallback to src/
+const getDocumenByEntryName = function getDocumenByEntryName(entrypoints, entryName, fallbackDir) {
   var _entrypoints$find;
   const entryDir = (_entrypoints$find = entrypoints.find(item => item.entryName === entryName)) === null || _entrypoints$find === void 0 ? void 0 : _entrypoints$find.absoluteEntryDir;
-  const docFile = findExists(DOC_EXT.map(item => `${entryDir}${path.sep}${DOCUMENT_FILE_NAME}.${item}`));
+  const entryDirs = DOC_EXT.map(item => `${entryDir}${path.sep}${DOCUMENT_FILE_NAME}.${item}`);
+  const fallbackDirs = fallbackDir ? DOC_EXT.map(item => [fallbackDir, 'src', `${DOCUMENT_FILE_NAME}.${item}`].join(path.sep)) : [];
+  const docFile = findExists([...entryDirs, ...fallbackDirs]);
   return docFile || undefined;
 };
 export default (() => ({
@@ -39,14 +44,11 @@ export default (() => ({
     const documentEntry = (entryName, templateParameters) => {
       const {
         entrypoints,
-        internalDirectory
+        internalDirectory,
+        appDirectory
       } = api.useAppContext();
       // search the document.[tsx|jsx|js|ts] under entry
-      // if not, use main as default
-      let documentFilePath = getDocumenByEntryName(entrypoints, entryName);
-      if (!documentFilePath) {
-        documentFilePath = getDocumenByEntryName(entrypoints, 'main');
-      }
+      const documentFilePath = getDocumenByEntryName(entrypoints, entryName, appDirectory);
       // if no document file, do nothing as default
       if (!documentFilePath) {
         return null;

package/dist/js/modern/document/constants.js

@@ -8,7 +8,7 @@ export const HTML_SSRDATASCRIPT_SEPARATOR = '<!--<?- SSRDataScript ?>-->';
 export const DOCUMENT_SSR_PLACEHOLDER = encodeURIComponent(HTML_SEPARATOR);
 export const DOCUMENT_CHUNKSMAP_PLACEHOLDER = encodeURIComponent(HTML_CHUNKSMAP_SEPARATOR);
 export const DOCUMENT_SSRDATASCRIPT_PLACEHOLDER = encodeURIComponent(HTML_SSRDATASCRIPT_SEPARATOR);
-export const DOCUMENT_FILE_NAME = 'document';
+export const DOCUMENT_FILE_NAME = 'Document';
 export const DOCUMENT_SCRIPTS_PLACEHOLDER = encodeURIComponent('<!-- chunk scripts placeholder -->');
 export const DOCUMENT_NO_SCRIPTE_PLACEHOLDER = encodeURIComponent('<!-- no-script -->');
 export const PLACEHOLDER_REPLACER_MAP = {

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

@@ -1,5 +1,4 @@
 import { getEntryOptions, createRuntimeExportsUtils, PLUGIN_SCHEMAS } from '@modern-js/utils';
-import "../types";
 const PLUGIN_IDENTIFIER = 'state';
 export default (() => ({
   name: '@modern-js/plugin-state',

package/dist/js/node/cli/index.js

@@ -32,7 +32,9 @@ var _default = () => ({
                */
               'styled-components': require.resolve('styled-components')
             },
-            envVars: ['IS_REACT18']
+            globalVars: {
+              'process.env.IS_REACT18': process.env.IS_REACT18
+            }
           }
         };
       },

package/dist/js/node/core/compatible.js

@@ -5,7 +5,6 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.useRuntimeContext = exports.createApp = exports.bootstrap = void 0;
 var _react = _interopRequireWildcard(require("react"));
-var _reactDom = _interopRequireDefault(require("react-dom"));
 var _hoistNonReactStatics = _interopRequireDefault(require("hoist-non-react-statics"));
 var _runtimeContext = require("../runtime-context");
 var _plugin = require("./plugin");
@@ -105,7 +104,7 @@ id,
 /**
  * root.render need use root to run function
  */
-root, ReactDOM = _reactDom.default
+root, ReactDOM
 // eslint-disable-next-line consistent-return
 ) => {
   let App = BootApp;
@@ -163,7 +162,9 @@ root, ReactDOM = _reactDom.default
         context.initialData = initialData;
       }
       const rootElement = typeof id !== 'string' ? id : document.getElementById(id || 'root');
-
+      if (!ReactDOM) {
+        throw Error('The `bootstrap` need provide `ReactDOM` parameter');
+      }
       // https://reactjs.org/blog/2022/03/08/react-18-upgrade-guide.html
       const ModernRender = App => {
         if (IS_REACT18) {

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

@@ -18,10 +18,15 @@ function _defineProperty(obj, key, value) { if (key in obj) { Object.definePrope
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
 const debug = (0, _utils.createDebugger)('html_genarate');
-const getDocumenByEntryName = function getDocumenByEntryName(entrypoints, entryName) {
+
+// get the entry document file,
+// if not exist, fallback to src/
+const getDocumenByEntryName = function getDocumenByEntryName(entrypoints, entryName, fallbackDir) {
   var _entrypoints$find;
   const entryDir = (_entrypoints$find = entrypoints.find(item => item.entryName === entryName)) === null || _entrypoints$find === void 0 ? void 0 : _entrypoints$find.absoluteEntryDir;
-  const docFile = (0, _utils.findExists)(_constants.DOC_EXT.map(item => `${entryDir}${_path.default.sep}${_constants.DOCUMENT_FILE_NAME}.${item}`));
+  const entryDirs = _constants.DOC_EXT.map(item => `${entryDir}${_path.default.sep}${_constants.DOCUMENT_FILE_NAME}.${item}`);
+  const fallbackDirs = fallbackDir ? _constants.DOC_EXT.map(item => [fallbackDir, 'src', `${_constants.DOCUMENT_FILE_NAME}.${item}`].join(_path.default.sep)) : [];
+  const docFile = (0, _utils.findExists)([...entryDirs, ...fallbackDirs]);
   return docFile || undefined;
 };
 var _default = () => ({
@@ -48,14 +53,11 @@ var _default = () => ({
     const documentEntry = (entryName, templateParameters) => {
       const {
         entrypoints,
-        internalDirectory
+        internalDirectory,
+        appDirectory
       } = api.useAppContext();
       // search the document.[tsx|jsx|js|ts] under entry
-      // if not, use main as default
-      let documentFilePath = getDocumenByEntryName(entrypoints, entryName);
-      if (!documentFilePath) {
-        documentFilePath = getDocumenByEntryName(entrypoints, 'main');
-      }
+      const documentFilePath = getDocumenByEntryName(entrypoints, entryName, appDirectory);
       // if no document file, do nothing as default
       if (!documentFilePath) {
         return null;

package/dist/js/node/document/constants.js

@@ -21,7 +21,7 @@ const DOCUMENT_CHUNKSMAP_PLACEHOLDER = encodeURIComponent(HTML_CHUNKSMAP_SEPARAT
 exports.DOCUMENT_CHUNKSMAP_PLACEHOLDER = DOCUMENT_CHUNKSMAP_PLACEHOLDER;
 const DOCUMENT_SSRDATASCRIPT_PLACEHOLDER = encodeURIComponent(HTML_SSRDATASCRIPT_SEPARATOR);
 exports.DOCUMENT_SSRDATASCRIPT_PLACEHOLDER = DOCUMENT_SSRDATASCRIPT_PLACEHOLDER;
-const DOCUMENT_FILE_NAME = 'document';
+const DOCUMENT_FILE_NAME = 'Document';
 exports.DOCUMENT_FILE_NAME = DOCUMENT_FILE_NAME;
 const DOCUMENT_SCRIPTS_PLACEHOLDER = encodeURIComponent('<!-- chunk scripts placeholder -->');
 exports.DOCUMENT_SCRIPTS_PLACEHOLDER = DOCUMENT_SCRIPTS_PLACEHOLDER;

package/dist/js/node/state/cli/index.js

@@ -5,7 +5,6 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.default = void 0;
 var _utils = require("@modern-js/utils");
-require("../types");
 const PLUGIN_IDENTIFIER = 'state';
 var _default = () => ({
   name: '@modern-js/plugin-state',

package/dist/js/treeshaking/cli/index.js

@@ -28,7 +28,9 @@ export default (function () {
                  */
                 'styled-components': require.resolve('styled-components')
               },
-              envVars: ['IS_REACT18']
+              globalVars: {
+                'process.env.IS_REACT18': process.env.IS_REACT18
+              }
             }
           };
         },

package/dist/js/treeshaking/core/compatible.js

@@ -5,7 +5,6 @@ import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
 import _toConsumableArray from "@babel/runtime/helpers/esm/toConsumableArray";
 var _excluded = ["context"];
 import React, { useContext, useMemo } from 'react';
-import defaultReactDOM from 'react-dom';
 import hoistNonReactStatics from 'hoist-non-react-statics';
 import { RuntimeReactContext } from "../runtime-context";
 import { runtime } from "./plugin";
@@ -94,30 +93,14 @@ export var bootstrap = /*#__PURE__*/function () {
   /**
    * root.render need use root to run function
    */
-  root) {
-    var ReactDOM,
-      App,
-      runner,
-      context,
-      runInit,
-      isBrowser,
-      _ssrData$data,
-      _ssrData$data2,
-      ssrData,
-      loadersData,
-      initialLoadersState,
-      initialData,
-      _rootElement,
-      ModernRender,
-      ModernHydrate,
-      isRedirectResponse,
-      _initialData,
-      _args = arguments;
+  root, ReactDOM
+  // eslint-disable-next-line consistent-return
+  ) {
+    var App, runner, context, runInit, isBrowser, _ssrData$data, _ssrData$data2, ssrData, loadersData, initialLoadersState, initialData, rootElement, ModernRender, ModernHydrate, isRedirectResponse, _initialData;
     return _regeneratorRuntime().wrap(function _callee$(_context2) {
       while (1) {
         switch (_context2.prev = _context2.next) {
           case 0:
-            ReactDOM = _args.length > 3 && _args[3] !== undefined ? _args[3] : defaultReactDOM;
             App = BootApp;
             runner = runnerMap.get(App); // ensure Component used is created by `createApp`
             if (!runner) {
@@ -139,20 +122,20 @@ export var bootstrap = /*#__PURE__*/function () {
               });
             }; // don't mount the App, let user in charge of it.
             if (id) {
-              _context2.next = 8;
+              _context2.next = 7;
               break;
             }
             return _context2.abrupt("return", /*#__PURE__*/React.createElement(App, {
               context: context
             }));
-          case 8:
+          case 7:
             isBrowser = typeof window !== 'undefined' && window.name !== 'nodejs';
             if (!isBrowser) {
-              _context2.next = 29;
+              _context2.next = 30;
               break;
             }
             if (!isClientArgs(id)) {
-              _context2.next = 26;
+              _context2.next = 27;
               break;
             }
             ssrData = window._SSR_DATA;
@@ -173,20 +156,27 @@ export var bootstrap = /*#__PURE__*/function () {
               ssrContext: ssrData === null || ssrData === void 0 ? void 0 : ssrData.context
             } : {}));
             context.initialData = ssrData === null || ssrData === void 0 ? void 0 : (_ssrData$data2 = ssrData.data) === null || _ssrData$data2 === void 0 ? void 0 : _ssrData$data2.initialData;
-            _context2.next = 18;
+            _context2.next = 17;
             return runInit(context);
-          case 18:
+          case 17:
             initialData = _context2.sent;
             if (initialData) {
               context.initialData = initialData;
             }
-            _rootElement = typeof id !== 'string' ? id : document.getElementById(id || 'root'); // https://reactjs.org/blog/2022/03/08/react-18-upgrade-guide.html
+            rootElement = typeof id !== 'string' ? id : document.getElementById(id || 'root');
+            if (ReactDOM) {
+              _context2.next = 22;
+              break;
+            }
+            throw Error('The `bootstrap` need provide `ReactDOM` parameter');
+          case 22:
+            // https://reactjs.org/blog/2022/03/08/react-18-upgrade-guide.html
             ModernRender = function ModernRender(App) {
               if (IS_REACT18) {
                 if (root) {
                   root.render(App);
                 } else if (ReactDOM.createRoot) {
-                  ReactDOM.createRoot(_rootElement).render(App);
+                  ReactDOM.createRoot(rootElement).render(App);
                 } else {
                   throw Error('The `bootstrap` `ReactDOM` parameter needs to provide the `createRoot` method');
                 }
@@ -194,7 +184,7 @@ export var bootstrap = /*#__PURE__*/function () {
                 if (!ReactDOM.render) {
                   throw Error('The `bootstrap` `ReactDOM` parameter needs to provide the `render` method');
                 }
-                ReactDOM.render(App, _rootElement);
+                ReactDOM.render(App, rootElement);
               }
             };
             ModernHydrate = function ModernHydrate(App, callback) {
@@ -202,12 +192,12 @@ export var bootstrap = /*#__PURE__*/function () {
                 if (!ReactDOM.hydrateRoot) {
                   throw Error('The `bootstrap` `ReactDOM` parameter needs to provide the `hydrateRoot` method');
                 }
-                ReactDOM.hydrateRoot(_rootElement, App);
+                ReactDOM.hydrateRoot(rootElement, App);
               } else {
                 if (!ReactDOM.hydrate) {
                   throw Error('The `bootstrap` `ReactDOM` parameter needs to provide the `hydrate` method');
                 }
-                ReactDOM.hydrate(App, _rootElement, callback);
+                ReactDOM.hydrate(App, rootElement, callback);
               }
             };
             return _context2.abrupt("return", runner.client({
@@ -223,12 +213,12 @@ export var bootstrap = /*#__PURE__*/function () {
                 }));
               }
             }));
-          case 26:
-            throw Error('`bootstrap` needs id in browser environment, it needs to be string or element');
           case 27:
-            _context2.next = 37;
+            throw Error('`bootstrap` needs id in browser environment, it needs to be string or element');
+          case 28:
+            _context2.next = 38;
             break;
-          case 29:
+          case 30:
             Object.assign(context, {
               ssrContext: id,
               isBrowser: false,
@@ -257,12 +247,12 @@ export var bootstrap = /*#__PURE__*/function () {
               }
               return false;
             };
-            _context2.next = 33;
+            _context2.next = 34;
             return runInit(context);
-          case 33:
+          case 34:
             _initialData = _context2.sent;
             if (isRedirectResponse(_initialData)) {
-              _context2.next = 37;
+              _context2.next = 38;
               break;
             }
             context.initialData = _initialData;
@@ -270,14 +260,14 @@ export var bootstrap = /*#__PURE__*/function () {
               App: App,
               context: context
             }));
-          case 37:
+          case 38:
           case "end":
             return _context2.stop();
         }
       }
     }, _callee);
   }));
-  return function bootstrap(_x, _x2, _x3) {
+  return function bootstrap(_x, _x2, _x3, _x4) {
     return _ref6.apply(this, arguments);
   };
 }();

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

@@ -1,6 +1,7 @@
 import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
 import _regeneratorRuntime from "@babel/runtime/helpers/esm/regeneratorRuntime";
 import _asyncToGenerator from "@babel/runtime/helpers/esm/asyncToGenerator";
+import _toConsumableArray from "@babel/runtime/helpers/esm/toConsumableArray";
 import path from 'path';
 import React from 'react';
 import ReactDomServer from 'react-dom/server';
@@ -9,14 +10,21 @@ import { createDebugger, findExists } from '@modern-js/utils';
 import { DocumentContext } from "../DocumentContext";
 import { DOCUMENT_SCRIPTS_PLACEHOLDER, DOCUMENT_FILE_NAME, DOCUMENT_META_PLACEHOLDER, PLACEHOLDER_REPLACER_MAP, DOC_EXT, DOCUMENT_SSR_PLACEHOLDER, DOCUMENT_CHUNKSMAP_PLACEHOLDER, DOCUMENT_SSRDATASCRIPT_PLACEHOLDER, HTML_SEPARATOR } from "../constants";
 var debug = createDebugger('html_genarate');
-var getDocumenByEntryName = function getDocumenByEntryName(entrypoints, entryName) {
+
+// get the entry document file,
+// if not exist, fallback to src/
+var getDocumenByEntryName = function getDocumenByEntryName(entrypoints, entryName, fallbackDir) {
   var _entrypoints$find;
   var entryDir = (_entrypoints$find = entrypoints.find(function (item) {
     return item.entryName === entryName;
   })) === null || _entrypoints$find === void 0 ? void 0 : _entrypoints$find.absoluteEntryDir;
-  var docFile = findExists(DOC_EXT.map(function (item) {
+  var entryDirs = DOC_EXT.map(function (item) {
     return "".concat(entryDir).concat(path.sep).concat(DOCUMENT_FILE_NAME, ".").concat(item);
-  }));
+  });
+  var fallbackDirs = fallbackDir ? DOC_EXT.map(function (item) {
+    return [fallbackDir, 'src', "".concat(DOCUMENT_FILE_NAME, ".").concat(item)].join(path.sep);
+  }) : [];
+  var docFile = findExists([].concat(_toConsumableArray(entryDirs), _toConsumableArray(fallbackDirs)));
   return docFile || undefined;
 };
 export default (function () {
@@ -47,13 +55,10 @@ export default (function () {
                 documentEntry = function documentEntry(entryName, templateParameters) {
                   var _api$useAppContext = api.useAppContext(),
                     entrypoints = _api$useAppContext.entrypoints,
-                    internalDirectory = _api$useAppContext.internalDirectory;
+                    internalDirectory = _api$useAppContext.internalDirectory,
+                    appDirectory = _api$useAppContext.appDirectory;
                   // search the document.[tsx|jsx|js|ts] under entry
-                  // if not, use main as default
-                  var documentFilePath = getDocumenByEntryName(entrypoints, entryName);
-                  if (!documentFilePath) {
-                    documentFilePath = getDocumenByEntryName(entrypoints, 'main');
-                  }
+                  var documentFilePath = getDocumenByEntryName(entrypoints, entryName, appDirectory);
                   // if no document file, do nothing as default
                   if (!documentFilePath) {
                     return null;

package/dist/js/treeshaking/document/constants.js

@@ -10,7 +10,7 @@ export var HTML_SSRDATASCRIPT_SEPARATOR = '<!--<?- SSRDataScript ?>-->';
 export var DOCUMENT_SSR_PLACEHOLDER = encodeURIComponent(HTML_SEPARATOR);
 export var DOCUMENT_CHUNKSMAP_PLACEHOLDER = encodeURIComponent(HTML_CHUNKSMAP_SEPARATOR);
 export var DOCUMENT_SSRDATASCRIPT_PLACEHOLDER = encodeURIComponent(HTML_SSRDATASCRIPT_SEPARATOR);
-export var DOCUMENT_FILE_NAME = 'document';
+export var DOCUMENT_FILE_NAME = 'Document';
 export var DOCUMENT_SCRIPTS_PLACEHOLDER = encodeURIComponent('<!-- chunk scripts placeholder -->');
 export var DOCUMENT_NO_SCRIPTE_PLACEHOLDER = encodeURIComponent('<!-- no-script -->');
 export var PLACEHOLDER_REPLACER_MAP = (_PLACEHOLDER_REPLACER = {}, _defineProperty(_PLACEHOLDER_REPLACER, DOCUMENT_NO_SCRIPTE_PLACEHOLDER, "We're sorry but react app doesn't work properly without JavaScript enabled. Please enable it to continue."), _defineProperty(_PLACEHOLDER_REPLACER, DOCUMENT_SSR_PLACEHOLDER, HTML_SEPARATOR), _defineProperty(_PLACEHOLDER_REPLACER, DOCUMENT_CHUNKSMAP_PLACEHOLDER, HTML_CHUNKSMAP_SEPARATOR), _defineProperty(_PLACEHOLDER_REPLACER, DOCUMENT_SSRDATASCRIPT_PLACEHOLDER, HTML_SSRDATASCRIPT_SEPARATOR), _PLACEHOLDER_REPLACER);

package/dist/js/treeshaking/state/cli/index.js

@@ -1,5 +1,4 @@
 import { getEntryOptions, createRuntimeExportsUtils, PLUGIN_SCHEMAS } from '@modern-js/utils';
-import "../types";
 var PLUGIN_IDENTIFIER = 'state';
 export default (function () {
   return {

package/dist/types/cli/index.d.ts

@@ -1,3 +1,3 @@
-import type { CliPlugin } from '@modern-js/core';
-declare const _default: () => CliPlugin;
+import type { CliPlugin, AppTools } from '@modern-js/app-tools';
+declare const _default: () => CliPlugin<AppTools>;
 export default _default;

package/dist/types/core/compatible.d.ts

@@ -1,4 +1,6 @@
 import React from 'react';
+import type { Renderer } from 'react-dom';
+import type { hydrateRoot, createRoot } from 'react-dom/client';
 import { RuntimeContext, TRuntimeContext } from '../runtime-context';
 import { Plugin } from './plugin';
 export declare type CreateAppOptions = {
@@ -7,15 +9,11 @@ export declare type CreateAppOptions = {
 export declare const createApp: ({
   plugins
 }: CreateAppOptions) => (App?: React.ComponentType<any>) => React.ComponentType<any>;
-interface HydrateFunc {
-  (container: Element | Document, initialChildren: React.ReactNode): void;
-  (initialChildren: React.ReactNode, container: Element | Document, callback?: () => void): void;
-}
 declare type BootStrap<T = unknown> = (App: React.ComponentType, id: string | HTMLElement | RuntimeContext, root?: any, ReactDOM?: {
-  render?: (children: React.ReactNode, rootElement?: HTMLElement) => void;
-  hydrate?: HydrateFunc;
-  createRoot?: (rootElement: HTMLElement) => any;
-  hydrateRoot?: HydrateFunc;
+  render?: Renderer;
+  hydrate?: Renderer;
+  createRoot?: typeof createRoot;
+  hydrateRoot?: typeof hydrateRoot;
 }) => Promise<T>;
 export declare const bootstrap: BootStrap;
 export declare const useRuntimeContext: () => TRuntimeContext;

package/dist/types/core/plugin.d.ts

@@ -14,8 +14,8 @@ declare const runtimeHooks: {
   client: import("@modern-js/plugin").AsyncPipeline<{
     App: React.ComponentType<any>;
     readonly context?: RuntimeContext | undefined;
-    ModernRender: (App: React.ReactNode) => void;
-    ModernHydrate: (App: React.ReactNode, callback?: () => void) => void;
+    ModernRender: (App: React.ReactElement) => void;
+    ModernHydrate: (App: React.ReactElement, callback?: () => void) => void;
   }, void>;
   server: import("@modern-js/plugin").AsyncPipeline<{
     App: React.ComponentType<any>;
@@ -49,8 +49,8 @@ export declare const createRuntime: () => import("@modern-js/plugin").Manager<{
   client: import("@modern-js/plugin").AsyncPipeline<{
     App: React.ComponentType<any>;
     readonly context?: RuntimeContext | undefined;
-    ModernRender: (App: React.ReactNode) => void;
-    ModernHydrate: (App: React.ReactNode, callback?: () => void) => void;
+    ModernRender: (App: React.ReactElement) => void;
+    ModernHydrate: (App: React.ReactElement, callback?: () => void) => void;
   }, void>;
   server: import("@modern-js/plugin").AsyncPipeline<{
     App: React.ComponentType<any>;
@@ -80,8 +80,8 @@ export declare const runtime: import("@modern-js/plugin").Manager<{
   client: import("@modern-js/plugin").AsyncPipeline<{
     App: React.ComponentType<any>;
     readonly context?: RuntimeContext | undefined;
-    ModernRender: (App: React.ReactNode) => void;
-    ModernHydrate: (App: React.ReactNode, callback?: () => void) => void;
+    ModernRender: (App: React.ReactElement) => void;
+    ModernHydrate: (App: React.ReactElement, callback?: () => void) => void;
   }, void>;
   server: import("@modern-js/plugin").AsyncPipeline<{
     App: React.ComponentType<any>;
@@ -107,8 +107,8 @@ export declare const createPlugin: (setup?: Setup<{
   client: import("@modern-js/plugin").AsyncPipeline<{
     App: React.ComponentType<any>;
     readonly context?: RuntimeContext | undefined;
-    ModernRender: (App: React.ReactNode) => void;
-    ModernHydrate: (App: React.ReactNode, callback?: () => void) => void;
+    ModernRender: (App: React.ReactElement) => void;
+    ModernHydrate: (App: React.ReactElement, callback?: () => void) => void;
   }, void>;
   server: import("@modern-js/plugin").AsyncPipeline<{
     App: React.ComponentType<any>;
@@ -133,8 +133,8 @@ export declare const createPlugin: (setup?: Setup<{
   client: import("@modern-js/plugin").AsyncPipeline<{
     App: React.ComponentType<any>;
     readonly context?: RuntimeContext | undefined;
-    ModernRender: (App: React.ReactNode) => void;
-    ModernHydrate: (App: React.ReactNode, callback?: () => void) => void;
+    ModernRender: (App: React.ReactElement) => void;
+    ModernHydrate: (App: React.ReactElement, callback?: () => void) => void;
   }, void>;
   server: import("@modern-js/plugin").AsyncPipeline<{
     App: React.ComponentType<any>;
@@ -159,8 +159,8 @@ export declare const createPlugin: (setup?: Setup<{
   client: import("@modern-js/plugin").AsyncPipeline<{
     App: React.ComponentType<any>;
     readonly context?: RuntimeContext | undefined;
-    ModernRender: (App: React.ReactNode) => void;
-    ModernHydrate: (App: React.ReactNode, callback?: () => void) => void;
+    ModernRender: (App: React.ReactElement) => void;
+    ModernHydrate: (App: React.ReactElement, callback?: () => void) => void;
   }, void>;
   server: import("@modern-js/plugin").AsyncPipeline<{
     App: React.ComponentType<any>;
@@ -173,7 +173,7 @@ export declare const createPlugin: (setup?: Setup<{
     context: RuntimeContext;
     pickedContext: TRuntimeContext;
   }, TRuntimeContext>;
-}, Record<string, never>>, Record<string, unknown>> | undefined) => import("@modern-js/plugin").Plugin<{
+}, Record<string, never>>, Record<string, unknown>, any, any> | undefined) => import("@modern-js/plugin").Plugin<{
   hoc: import("@modern-js/plugin").Pipeline<{
     App: React.ComponentType<any>;
   }, React.ComponentType<any>>;
@@ -185,8 +185,8 @@ export declare const createPlugin: (setup?: Setup<{
   client: import("@modern-js/plugin").AsyncPipeline<{
     App: React.ComponentType<any>;
     readonly context?: RuntimeContext | undefined;
-    ModernRender: (App: React.ReactNode) => void;
-    ModernHydrate: (App: React.ReactNode, callback?: () => void) => void;
+    ModernRender: (App: React.ReactElement) => void;
+    ModernHydrate: (App: React.ReactElement, callback?: () => void) => void;
   }, void>;
   server: import("@modern-js/plugin").AsyncPipeline<{
     App: React.ComponentType<any>;

package/dist/types/document/cli/index.d.ts

@@ -1,3 +1,3 @@
-import type { CliPlugin } from '@modern-js/core';
-declare const _default: () => CliPlugin;
+import type { CliPlugin, AppTools } from '@modern-js/app-tools';
+declare const _default: () => CliPlugin<AppTools>;
 export default _default;

package/dist/types/document/constants.d.ts

@@ -6,7 +6,7 @@ export declare const HTML_SSRDATASCRIPT_SEPARATOR = "<!--<?- SSRDataScript ?>-->
 export declare const DOCUMENT_SSR_PLACEHOLDER: string;
 export declare const DOCUMENT_CHUNKSMAP_PLACEHOLDER: string;
 export declare const DOCUMENT_SSRDATASCRIPT_PLACEHOLDER: string;
-export declare const DOCUMENT_FILE_NAME = "document";
+export declare const DOCUMENT_FILE_NAME = "Document";
 export declare const DOCUMENT_SCRIPTS_PLACEHOLDER: string;
 export declare const DOCUMENT_NO_SCRIPTE_PLACEHOLDER: string;
 export declare const PLACEHOLDER_REPLACER_MAP: {

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

@@ -1,3 +1,3 @@
-import type { CliPlugin } from '@modern-js/core';
-declare const _default: () => CliPlugin;
+import type { CliPlugin, AppTools } from '@modern-js/app-tools';
+declare const _default: () => CliPlugin<AppTools>;
 export default _default;

package/dist/types/ssr/cli/index.d.ts

@@ -1,3 +1,3 @@
-import type { CliPlugin } from '@modern-js/core';
-declare const _default: () => CliPlugin;
+import type { CliPlugin, AppTools } from '@modern-js/app-tools';
+declare const _default: () => CliPlugin<AppTools>;
 export default _default;

package/dist/types/ssr/serverRender/types.d.ts

@@ -1,5 +1,5 @@
 /// <reference types="react" />
-import type { ServerConfig } from '@modern-js/core';
+import { ServerUserConfig } from '@modern-js/app-tools';
 import type { RuntimeContext } from '../../core';
 import { RenderLevel } from './renderToString/type';
 export type { SSRServerContext } from './renderToString/type';
@@ -7,7 +7,7 @@ export declare type ModernSSRReactComponent = React.ComponentType<any>;
 export { RuntimeContext, RenderLevel };
 export declare type SSRPluginConfig = {
   crossorigin?: boolean | 'anonymous' | 'use-credentials';
-} & Exclude<ServerConfig['ssr'], boolean>;
+} & Exclude<ServerUserConfig['ssr'], boolean>;
 export declare type ServerRenderOptions = {
   App: ModernSSRReactComponent;
   config: SSRPluginConfig;

package/dist/types/state/cli/index.d.ts

@@ -1,3 +1,3 @@
-import type { CliPlugin } from '@modern-js/core';
-declare const _default: () => CliPlugin;
+import type { CliPlugin, AppTools } from '@modern-js/app-tools';
+declare const _default: () => CliPlugin<AppTools>;
 export default _default;

package/package.json

@@ -11,7 +11,7 @@
     "modern",
     "modern.js"
   ],
-  "version": "2.0.0-beta.1",
+  "version": "2.0.0-beta.2",
   "engines": {
     "node": ">=14.17.6"
   },
@@ -143,9 +143,9 @@
     "redux-logger": "^3.0.6",
     "serialize-javascript": "^6.0.0",
     "styled-components": "^5.3.1",
-    "@modern-js/plugin": "2.0.0-beta.1",
-    "@modern-js/types": "2.0.0-beta.1",
-    "@modern-js/utils": "2.0.0-beta.1"
+    "@modern-js/plugin": "2.0.0-beta.2",
+    "@modern-js/types": "2.0.0-beta.2",
+    "@modern-js/utils": "2.0.0-beta.2"
   },
   "peerDependencies": {
     "react": ">=17",
@@ -166,11 +166,12 @@
     "react-dom": "^18",
     "ts-jest": "^27.0.4",
     "typescript": "^4",
-    "@modern-js/core": "2.0.0-beta.1",
-    "@modern-js/server-core": "2.0.0-beta.1",
-    "@modern-js/utils": "2.0.0-beta.1",
-    "@scripts/build": "2.0.0-beta.1",
-    "@scripts/jest-config": "2.0.0-beta.1"
+    "@modern-js/core": "2.0.0-beta.2",
+    "@modern-js/server-core": "2.0.0-beta.2",
+    "@modern-js/utils": "2.0.0-beta.2",
+    "@scripts/build": "2.0.0-beta.2",
+    "@modern-js/app-tools": "2.0.0-beta.2",
+    "@scripts/jest-config": "2.0.0-beta.2"
   },
   "sideEffects": false,
   "modernConfig": {},
@@ -179,9 +180,9 @@
     "access": "public"
   },
   "scripts": {
-    "dev": "modern build --watch",
-    "new": "modern new",
-    "build": "modern build",
-    "test": "jest --passWithNoTests"
+    "dev": "modern-lib build --watch",
+    "new": "modern-lib new",
+    "build": "modern-lib build",
+    "test": "jest"
   }
 }