@modern-js/plugin-garfish 1.3.0 → 1.3.1

package/dist/js/treeshaking/runtime/plugin.js

@@ -1,6 +1,6 @@
 function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
 
-var _excluded = ["manifest", "LoadingComponent"];
+var _excluded = ["manifest"];
 
 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; }
 
@@ -38,6 +38,7 @@ function asyncGeneratorStep(gen, resolve, reject, _next, _throw, key, arg) { try
 
 function _asyncToGenerator(fn) { return function () { var self = this, args = arguments; return new Promise(function (resolve, reject) { var gen = fn.apply(self, args); function _next(value) { asyncGeneratorStep(gen, resolve, reject, _next, _throw, "next", value); } function _throw(err) { asyncGeneratorStep(gen, resolve, reject, _next, _throw, "throw", err); } _next(undefined); }); }; }
 
+// eslint-disable-next-line filenames/match-exported
 import { createPlugin } from '@modern-js/runtime-core';
 import React from 'react';
 import hoistNonReactStatics from 'hoist-non-react-statics';
@@ -54,13 +55,13 @@ function initOptions() {
 
 function _initOptions() {
   _initOptions = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee2() {
-    var _window, _window$modern_manife;
+    var _window, _window$modern_manife, _window2, _window2$modern_manif;
 
     var manifest,
         options,
         apps,
-        _window2,
-        _window2$modern_manif,
+        _window3,
+        _window3$modern_manif,
         _args2 = arguments;
 
     return _regeneratorRuntime.wrap(function _callee2$(_context2) {
@@ -69,7 +70,7 @@ function _initOptions() {
           case 0:
             manifest = _args2.length > 0 && _args2[0] !== undefined ? _args2[0] : {};
             options = _args2.length > 1 ? _args2[1] : undefined;
-            apps = []; // use manifest modules
+            apps = options.apps || []; // use manifest modules
 
             if (manifest !== null && manifest !== void 0 && manifest.modules) {
               apps = manifest === null || manifest === void 0 ? void 0 : manifest.modules;
@@ -91,14 +92,14 @@ function _initOptions() {
 
           case 9:
             // get inject modules list
-            if ((_window = window) !== null && _window !== void 0 && (_window$modern_manife = _window.modern_manifest) !== null && _window$modern_manife !== void 0 && _window$modern_manife.modules) {
-              apps = (_window2 = window) === null || _window2 === void 0 ? void 0 : (_window2$modern_manif = _window2.modern_manifest) === null || _window2$modern_manif === void 0 ? void 0 : _window2$modern_manif.modules;
+            if ((_window = window) !== null && _window !== void 0 && (_window$modern_manife = _window.modern_manifest) !== null && _window$modern_manife !== void 0 && _window$modern_manife.modules && ((_window2 = window) === null || _window2 === void 0 ? void 0 : (_window2$modern_manif = _window2.modern_manifest) === null || _window2$modern_manif === void 0 ? void 0 : _window2$modern_manif.modules.length) > 0) {
+              apps = (_window3 = window) === null || _window3 === void 0 ? void 0 : (_window3$modern_manif = _window3.modern_manifest) === null || _window3$modern_manif === void 0 ? void 0 : _window3$modern_manif.modules;
               logger('modern_manifest', apps);
             }
 
-            return _context2.abrupt("return", _objectSpread({
+            return _context2.abrupt("return", _objectSpread(_objectSpread({}, options), {}, {
               apps: apps
-            }, options));
+            }));
 
           case 11:
           case "end":
@@ -110,22 +111,15 @@ function _initOptions() {
   return _initOptions.apply(this, arguments);
 }
 
-export default (function (config) {
+var GarfishPlugin = function GarfishPlugin(config) {
   setExternal();
 
-  var _config$manifest = config.manifest,
-      manifest = _config$manifest === void 0 ? {} : _config$manifest,
-      LoadingComponent = config.LoadingComponent,
+  var manifest = config.manifest,
       options = _objectWithoutProperties(config, _excluded);
 
   logger('createPlugin', {
     config: config
   });
-
-  if (!manifest.LoadingComponent && LoadingComponent) {
-    manifest.LoadingComponent = LoadingComponent;
-  }
-
   var promise = initOptions(manifest, options);
   return createPlugin(function () {
     return {
@@ -227,4 +221,6 @@ export default (function (config) {
       }
     };
   });
-});
+};
+
+export default GarfishPlugin;

package/dist/js/treeshaking/runtime/utils/MApp.js

@@ -38,9 +38,7 @@ import Garfish from 'garfish';
 import { logger, generateSubAppContainerKey } from "../../util";
 import { Loadable } from "../loadable";
 import { jsx as _jsx } from "react/jsx-runtime";
-export function generateMApp(options, _ref) {
-  var LoadingComponent = _ref.LoadingComponent;
-
+export function generateMApp(options, manifest) {
   var MApp = /*#__PURE__*/function (_React$Component) {
     _inherits(MApp, _React$Component);
 
@@ -83,64 +81,59 @@ export function generateMApp(options, _ref) {
         var garfishOptions = _objectSpread({
           domGetter: "#".concat(domId),
           beforeLoad: function beforeLoad() {
-            // logger('MApp beforeLoad', args);
-            setLoadingState({
-              isLoading: true,
-              error: null
-            });
-
             for (var _len2 = arguments.length, args = new Array(_len2), _key2 = 0; _key2 < _len2; _key2++) {
               args[_key2] = arguments[_key2];
             }
 
+            logger('MApp beforeLoad', args);
+            setLoadingState({
+              isLoading: true,
+              error: null
+            });
             return _beforeLoad === null || _beforeLoad === void 0 ? void 0 : _beforeLoad.apply(void 0, args);
           },
           beforeMount: function beforeMount() {
-            // logger('MApp beforeMount', args);
-            setLoadingState({
-              isLoading: false
-            });
-
             for (var _len3 = arguments.length, args = new Array(_len3), _key3 = 0; _key3 < _len3; _key3++) {
               args[_key3] = arguments[_key3];
             }
 
+            logger('MApp beforeMount', args);
+            setLoadingState({
+              isLoading: false
+            });
             return _beforeMount === null || _beforeMount === void 0 ? void 0 : _beforeMount.apply(void 0, args);
           },
           errorLoadApp: function errorLoadApp(error) {
-            // logger('MApp errorLoadApp', args);
-            setLoadingState({
-              error: error
-            });
-
             for (var _len4 = arguments.length, args = new Array(_len4 > 1 ? _len4 - 1 : 0), _key4 = 1; _key4 < _len4; _key4++) {
               args[_key4 - 1] = arguments[_key4];
             }
 
-            return _errorLoadApp === null || _errorLoadApp === void 0 ? void 0 : _errorLoadApp.apply(void 0, [error].concat(args));
-          },
-          errorMountApp: function errorMountApp(error) {
-            // logger('MApp errorMountApp', args);
+            logger('MApp errorLoadApp', args);
             setLoadingState({
               error: error
             });
-
+            return _errorLoadApp === null || _errorLoadApp === void 0 ? void 0 : _errorLoadApp.apply(void 0, [error].concat(args));
+          },
+          errorMountApp: function errorMountApp(error) {
             for (var _len5 = arguments.length, args = new Array(_len5 > 1 ? _len5 - 1 : 0), _key5 = 1; _key5 < _len5; _key5++) {
               args[_key5 - 1] = arguments[_key5];
             }
 
-            return _errorMountApp === null || _errorMountApp === void 0 ? void 0 : _errorMountApp.apply(void 0, [error].concat(args));
-          },
-          errorUnmountApp: function errorUnmountApp(error) {
-            // logger('MApp errorUnmountApp', args);
+            logger('MApp errorMountApp', args);
             setLoadingState({
               error: error
             });
-
+            return _errorMountApp === null || _errorMountApp === void 0 ? void 0 : _errorMountApp.apply(void 0, [error].concat(args));
+          },
+          errorUnmountApp: function errorUnmountApp(error) {
             for (var _len6 = arguments.length, args = new Array(_len6 > 1 ? _len6 - 1 : 0), _key6 = 1; _key6 < _len6; _key6++) {
               args[_key6 - 1] = arguments[_key6];
             }
 
+            logger('MApp errorUnmountApp', args);
+            setLoadingState({
+              error: error
+            });
             return _errorUnmountApp === null || _errorUnmountApp === void 0 ? void 0 : _errorUnmountApp.apply(void 0, [error].concat(args));
           }
         }, otherOptions);
@@ -166,7 +159,6 @@ export function generateMApp(options, _ref) {
     }, {
       key: "render",
       value: function render() {
-        logger('MApp render status', this.state);
         return /*#__PURE__*/_jsx("div", {
           id: generateSubAppContainerKey()
         });
@@ -176,5 +168,5 @@ export function generateMApp(options, _ref) {
     return MApp;
   }(React.Component);
 
-  return Loadable(MApp)(LoadingComponent);
+  return Loadable(MApp)(manifest === null || manifest === void 0 ? void 0 : manifest.loadable);
 }

package/dist/js/treeshaking/runtime/utils/apps.js

@@ -55,7 +55,6 @@ import { jsx as _jsx } from "react/jsx-runtime";
 import { Fragment as _Fragment } from "react/jsx-runtime";
 
 function getAppInstance(appInfo, manifest) {
-  var LoadingComponent = manifest.LoadingComponent;
   var locationHref = '';
 
   var MicroApp = /*#__PURE__*/function (_React$Component) {
@@ -263,7 +262,7 @@ function getAppInstance(appInfo, manifest) {
     return MicroApp;
   }(React.Component);
 
-  return Loadable(withRouter(MicroApp))(LoadingComponent);
+  return Loadable(withRouter(MicroApp))(manifest === null || manifest === void 0 ? void 0 : manifest.loadable);
 }
 
 export function generateApps(options, manifest) {

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

@@ -1,12 +1,4 @@
-import { createPlugin, NormalizedConfig } from '@modern-js/core';
-declare type GetFirstArgumentOfFunction<T> = T extends (first: infer FirstArgument, ...args: any[]) => any ? FirstArgument : never;
-interface InitializerOptions {
-  validateSchema: () => Array<any>;
-  externals: any;
-  componentKey: string;
-}
-declare type InitializerFn = GetFirstArgumentOfFunction<typeof createPlugin>;
-export declare const initializer: (options: InitializerOptions) => InitializerFn;
+import { NormalizedConfig } from '@modern-js/core';
 
 declare const _default: import("@modern-js/core").AsyncPlugin<Partial<import("@modern-js/core").Progresses2Threads<{
   config: import("@modern-js/core").ParallelWorkflow<void, unknown>;

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

@@ -1,2 +1,2 @@
-export declare const makeProvider: (componentKey: string) => string;
+export declare const makeProvider: () => string;
 export declare const makeRenderFunction: (code: string) => string;

package/dist/types/index.d.ts

@@ -1 +1,2 @@
-export { default } from './cli';
+export { default } from './runtime';
+export * from './runtime';

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

@@ -1,2 +1,4 @@
 export { default } from './plugin';
-export * from './useModuleApps';
+export { useModuleApps, useMicroApps, useModuleApp } from './useModuleApps';
+export type { Manifest, ModuleInfo } from './useModuleApps';
+export { default as Garfish } from 'garfish';

package/dist/types/runtime/loadable.d.ts

@@ -1,5 +1,5 @@
 import React from 'react';
-import { LoadingComponent, MicroComponentProps } from './useModuleApps';
+import { LoadableConfig, MicroComponentProps } from './useModuleApps';
 export interface MicroProps {
   setLoadingState: (state: {
     isLoading?: boolean;
@@ -7,16 +7,13 @@ export interface MicroProps {
   }) => void;
   [key: string]: any;
 }
-export declare function Loadable(WrapComponent: any): (defaultLoadingComponent?: LoadingComponent | undefined) => {
+export declare function Loadable(WrapComponent: any): (defaultLoadable?: LoadableConfig | undefined) => {
   new (props: MicroComponentProps | Readonly<MicroComponentProps>): {
     state: {
       error: any;
       pastDelay: boolean;
       timedOut: boolean;
       isLoading: boolean;
-      delay: number;
-      timeout: number;
-      LoadingComponent?: LoadingComponent;
     };
     mounted: boolean;
     delay: NodeJS.Timeout | undefined;
@@ -53,9 +50,6 @@ export declare function Loadable(WrapComponent: any): (defaultLoadingComponent?:
       pastDelay: boolean;
       timedOut: boolean;
       isLoading: boolean;
-      delay: number;
-      timeout: number;
-      LoadingComponent?: LoadingComponent;
     };
     mounted: boolean;
     delay: NodeJS.Timeout | undefined;

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

@@ -1,3 +1,29 @@
-declare const _default: any;
-
-export default _default;
+import React from 'react';
+import { Config } from './useModuleApps';
+declare const GarfishPlugin: (config: Config) => import("@modern-js/core").Plugin<Partial<import("@modern-js/runtime-core").Progresses2Threads<{
+  hoc: import("@modern-js/runtime-core").Pipeline<{
+    App: React.ComponentType<any>;
+  }, React.ComponentType<any>>;
+  provide: import("@modern-js/runtime-core").Pipeline<{
+    element: JSX.Element;
+    readonly props: import("@modern-js/runtime-core/src/plugin").AppProps;
+    readonly context: import("@modern-js/runtime-core").RuntimeContext;
+  }, JSX.Element>;
+  client: import("@modern-js/runtime-core").AsyncPipeline<{
+    App: React.ComponentType<any>;
+    readonly context?: import("@modern-js/runtime-core").RuntimeContext | undefined;
+    rootElement: HTMLElement;
+  }, void>;
+  server: import("@modern-js/runtime-core").AsyncPipeline<{
+    App: React.ComponentType<any>;
+    readonly context?: import("@modern-js/runtime-core").RuntimeContext | undefined;
+  }, string>;
+  init: import("@modern-js/runtime-core").AsyncPipeline<{
+    context: import("@modern-js/runtime-core").RuntimeContext;
+  }, unknown>;
+  pickContext: import("@modern-js/runtime-core").Pipeline<{
+    context: import("@modern-js/runtime-core").RuntimeContext;
+    pickedContext: import("@modern-js/runtime-core").TRuntimeContext;
+  }, import("@modern-js/runtime-core").TRuntimeContext>;
+} & import("@modern-js/runtime-core").ClearDraftProgress<{}>>>>;
+export default GarfishPlugin;

package/dist/types/runtime/useModuleApps.d.ts

@@ -7,13 +7,8 @@ export declare type ModuleInfo = GarfishInterfaces.AppInfo & {
 export declare type ModulesInfo = Array<ModuleInfo>;
 export declare type Manifest = {
   modules?: ModulesInfo;
+  loadable?: LoadableConfig;
   getAppList?: () => Promise<Array<GarfishInterfaces.AppInfo>>;
-  LoadingComponent?: LoadingComponent;
-  componentKey?: string;
-};
-export declare type ModernGarfishConfig = {
-  LoadingComponent?: LoadingComponent;
-  manifest?: Manifest;
 };
 export declare type LoadingComponent = React.ComponentType<{
   isLoading: boolean;
@@ -22,13 +17,16 @@ export declare type LoadingComponent = React.ComponentType<{
   error: any;
   retry: () => void;
 }>;
-export interface LoadingConfig {
+export interface LoadableConfig {
   timeout?: number;
   delay?: number;
-  LoadingComponent?: LoadingComponent;
+  loading?: LoadingComponent;
 }
+export declare type ModernGarfishConfig = {
+  manifest?: Manifest;
+};
 export declare type MicroComponentProps = {
-  loadingConfig: LoadingConfig;
+  loadable?: LoadableConfig;
 };
 export declare type Config = Partial<Options> & ModernGarfishConfig;
 export declare function useModuleApps(): Record<string, import("react").ComponentType<any>>;

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

@@ -9,18 +9,13 @@ declare global {
     };
   }
 }
-export declare function generateMApp(options: typeof Garfish.options, {
-  LoadingComponent
-}: Manifest): {
+export declare function generateMApp(options: typeof Garfish.options, manifest?: Manifest): {
   new (props: import("../useModuleApps").MicroComponentProps | Readonly<import("../useModuleApps").MicroComponentProps>): {
     state: {
       error: any;
       pastDelay: boolean;
       timedOut: boolean;
       isLoading: boolean;
-      delay: number;
-      timeout: number;
-      LoadingComponent?: import("../useModuleApps").LoadingComponent | undefined;
     };
     mounted: boolean;
     delay: NodeJS.Timeout | undefined;
@@ -32,9 +27,6 @@ export declare function generateMApp(options: typeof Garfish.options, {
       pastDelay: boolean;
       timedOut: boolean;
       isLoading: boolean;
-      delay: number;
-      timeout: number;
-      LoadingComponent?: import("../useModuleApps").LoadingComponent | undefined;
     }>): void;
     readonly retry: () => void;
     clearTimeouts(): void;
@@ -65,9 +57,6 @@ export declare function generateMApp(options: typeof Garfish.options, {
       pastDelay: boolean;
       timedOut: boolean;
       isLoading: boolean;
-      delay: number;
-      timeout: number;
-      LoadingComponent?: import("../useModuleApps").LoadingComponent | undefined;
     };
     mounted: boolean;
     delay: NodeJS.Timeout | undefined;
@@ -79,9 +68,6 @@ export declare function generateMApp(options: typeof Garfish.options, {
       pastDelay: boolean;
       timedOut: boolean;
       isLoading: boolean;
-      delay: number;
-      timeout: number;
-      LoadingComponent?: import("../useModuleApps").LoadingComponent | undefined;
     }>): void;
     readonly retry: () => void;
     clearTimeouts(): void;

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

@@ -4,7 +4,7 @@ import { Manifest, MicroComponentProps, ModulesInfo } from '../useModuleApps';
 export interface AppMap {
   [key: string]: React.ComponentType<MicroComponentProps>;
 }
-export declare function generateApps(options: typeof Garfish.options, manifest: Manifest): {
+export declare function generateApps(options: typeof Garfish.options, manifest?: Manifest): {
   apps: AppMap;
   appInfoList: ModulesInfo;
 };

package/package.json

@@ -11,9 +11,22 @@
     "modern",
     "modern.js"
   ],
-  "version": "1.3.0",
+  "version": "1.3.1",
   "jsnext:source": "./src/index.ts",
   "types": "./dist/types/runtime/index.d.ts",
+  "typesVersions": {
+    "*": {
+      ".": [
+        "./dist/types/runtime/index.d.ts"
+      ],
+      "cli": [
+        "./dist/types/cli/index.d.ts"
+      ],
+      "runtime": [
+        "./dist/types/runtime/index.d.ts"
+      ]
+    }
+  },
   "main": "./dist/js/node/index.js",
   "module": "./dist/js/treeshaking/runtime/index.js",
   "jsnext:modern": "./dist/js/modern/index.js",
@@ -33,7 +46,7 @@
   },
   "dependencies": {
     "@babel/runtime": "^7",
-    "@modern-js/utils": "^1.3.0",
+    "@modern-js/utils": "^1.3.1",
     "@types/debug": "^4.1.7",
     "@types/react-loadable": "^5.5.6",
     "debug": "^4.3.2",
@@ -42,10 +55,10 @@
     "react-loadable": "^5.5.0"
   },
   "devDependencies": {
-    "@modern-js/core": "^1.4.0",
+    "@modern-js/core": "^1.4.1",
     "@modern-js/plugin-router": "^1.2.2",
     "@modern-js/runtime-core": "^1.2.2",
-    "@modern-js/types": "^1.3.0",
+    "@modern-js/types": "^1.3.1",
     "@scripts/build": "0.0.0",
     "@scripts/jest-config": "0.0.0",
     "@testing-library/jest-dom": "^5.16.1",
@@ -53,7 +66,7 @@
     "@testing-library/react-hooks": "^7.0.1",
     "@testing-library/user-event": "^13.5.0",
     "@types/hoist-non-react-statics": "^3.3.1",
-    "@types/jest": "^26",
+    "@types/jest": "^26.0.24",
     "@types/node": "^14",
     "@types/react": "^17",
     "@types/react-dom": "^17",
@@ -67,7 +80,7 @@
     "webpack-chain": "^6.5.1"
   },
   "peerDependencies": {
-    "@modern-js/core": "^1.4.0",
+    "@modern-js/core": "^1.4.1",
     "@modern-js/plugin-router": "^1.2.2",
     "@modern-js/runtime-core": "^1.2.2"
   },
@@ -75,8 +88,7 @@
   "modernConfig": {},
   "publishConfig": {
     "registry": "https://registry.npmjs.org/",
-    "access": "public",
-    "types": "./dist/types/runtime/index.d.ts"
+    "access": "public"
   },
   "scripts": {
     "new": "modern new",

package/tests/cli.test.tsx

@@ -1,50 +1,28 @@
 import '@testing-library/jest-dom';
-import { PLUGIN_SCHEMAS } from '@modern-js/utils';
-import { makeProvider } from '../src/cli/utils';
-import GarfishPlugin, { initializer } from '../src/cli';
+import GarfishPlugin from '../src/cli';
 
-jest.mock('@modern-js/core', () => {
-  const originalModule = jest.requireActual('@modern-js/core');
-  return {
-    __esModule: true,
-    ...originalModule,
-    default: jest.fn(() => 'mocked baz'),
-    useResolvedConfigContext: () => ({
-      runtime: {
-        masterApp: {
-          manifest: {
-            componentKey: 'test-dynamic-key',
-          },
-        },
-      },
-      deploy: {
-        microFrontend: 'dynamicComponentKey',
-      },
-    }),
-  };
-});
+// jest.mock('@modern-js/core', () => {
+//   const originalModule = jest.requireActual('@modern-js/core');
+//   return {
+//     __esModule: true,
+//     ...originalModule,
+//     default: jest.fn(() => 'mocked baz'),
+//     useResolvedConfigContext: () => ({
+//       runtime: {
+//         masterApp: {
+//           manifest: {
+//             componentKey: 'test-dynamic-key',
+//           },
+//         },
+//       },
+//       deploy: {
+//         microFrontend: 'dynamicComponentKey',
+//       },
+//     }),
+//   };
+// });
 
 describe('plugin-garfish cli', () => {
-  test('makeProvider', async () => {
-    const garfishExport = makeProvider('modernJSExportComponent');
-    expect(garfishExport).toMatchSnapshot();
-  });
-
-  test('test modifyEntryExport', () => {
-    const lifeCycle: any = initializer({
-      validateSchema() {
-        return PLUGIN_SCHEMAS['@modern-js/plugin-garfish'];
-      },
-      externals: { 'react-dom': 'react-dom', react: 'react' },
-      componentKey: 'test-dynamic-key',
-    })();
-    const { exportStatement } = lifeCycle.modifyEntryExport({
-      entrypoint: 'hello',
-      exportStatement: '',
-    });
-    expect(exportStatement).toMatchSnapshot();
-  });
-
   test('cli garfish plugin', () => {
     expect(GarfishPlugin.name).toBe('@modern-js/plugin-garfish');
   });

package/tests/hooks.test.tsx

@@ -2,6 +2,7 @@ import React from 'react';
 import { render } from '@testing-library/react';
 import { createApp } from '@modern-js/runtime-core';
 import '@testing-library/jest-dom';
+
 import ModernGarfishPlugin, {
   useMicroApps,
   useModuleApp,

package/tests/index.test.tsx

@@ -12,7 +12,8 @@ import {
   useLocation,
   MemoryRouter,
 } from '@modern-js/plugin-router';
-import ModernGarfishPlugin, { useMicroApps } from '../src/runtime';
+import ModernGarfishPlugin from '../src/runtime';
+import { useMicroApps } from '../src';
 import {
   TABLE_LIST_ESCAPE_NODE,
   TABLE_LIST_HTML,
@@ -99,8 +100,10 @@ describe('plugin-garfish', () => {
     const microFrontendConfig = {
       apps: [tableListModuleInfo, dashBoardModuleInfo, userInfo],
       manifest: {
-        LoadingComponent() {
-          return <div data-testid="loading-id">loading</div>;
+        loadable: {
+          loading: ()=> {
+            return <div data-testid="loading-id">loading</div>;
+          }
         },
       },
     };

package/tsconfig.json

@@ -7,7 +7,8 @@
     "isolatedModules": true,
     "esModuleInterop": true,
     "paths": {},
-    "types": ["node", "jest","@types/jest"]
+    "types": ["node", "jest", "@types/jest"]
   },
-  "include": ["src"]
+  "include": ["src"],
+  "exclude": ["**/*.test.tsx"]
 }