@appigram/react-code-split-ssr 1.2.2 → 1.2.5

package/README.md

@@ -3,7 +3,7 @@ React code splitting with server side rendering
 
 ## How it works
 
-- Based on React Router 4
+- Based on React Router 6
 - Server side: Load all components synchronously, then render to string.
 - Client side: Load the initial component before rendering, render the entire screen synchronously, then load the rest of routes asynchronously.
 
@@ -26,9 +26,6 @@ export const routes = [
   { exact: true, path: '/posts', component: Posts },
 ]
 
-export const redirects = [
-  { from: '/test', to: '/posts' }
-]
 ```
 Client:
 ```js
@@ -105,6 +102,9 @@ A function that returns a `Promise` object which can be resolved to React Router
 - redirects  {objects}[] - An array of `<Redirect>` props object
 - notFoundComp {Component} - A React component for 404 Not Found, only accepts `() => <Bundle/>`
 
+## v1.2.0
+- [x] Remove redirects, Fix React-Router v6 specific rendering
+
 ## v1.1.0
 - [x] Upgrade to React-Router v6
 

package/lib/bundle.js

@@ -20,7 +20,7 @@ const Bundle = ({ mod, loading }) => {
         })();
     }, []);
     const Mod = state.mod;
-    const Loading = loading || (() => _jsx("div", {}, void 0));
-    return state.mod ? _jsx(Mod, {}, void 0) : _jsx(Loading, {}, void 0);
+    const Loading = loading || (() => _jsx("div", {}));
+    return state.mod ? _jsx(Mod, {}) : _jsx(Loading, {});
 };
 export default Bundle;

package/lib/generate-routes.js

@@ -7,7 +7,7 @@ var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, ge
         step((generator = generator.apply(thisArg, _arguments || [])).next());
     });
 };
-import { jsx as _jsx } from "react/jsx-runtime";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { matchPath, Route, Routes } from "react-router-dom";
 const generateRoutes = (options = {
     pathname: "/",
@@ -25,10 +25,10 @@ const generateRoutes = (options = {
             return bundle;
         const isRouteMatched = (preload && preload.path === path) || (!preload && !path);
         const Element = isRouteMatched ? preloadedComp.default : bundle;
-        return isRouteMatched ? _jsx(Element, {}, void 0) : Element;
+        return isRouteMatched ? _jsx(Element, {}) : Element;
     };
-    return (_jsx(Routes, { children: options.routes.map((props, i) => {
-            return (_jsx(Route, { path: props.path, element: renderElement(props.path, props.element) }, i));
-        }) }, void 0));
+    return (_jsxs(Routes, { children: [options.routes.map((props, i) => {
+                return (_jsx(Route, { path: props.path, element: renderElement(props.path, props.element) }, i));
+            }), _jsx(Route, { path: '*', element: renderElement(null, options.notFoundComp) }, 'nf')] }));
 });
 export default generateRoutes;

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@appigram/react-code-split-ssr",
-	"version": "1.2.2",
+	"version": "1.2.5",
 	"description": "React code splitting with SSR",
 	"main": "./lib/index.js",
 	"scripts": {
@@ -22,15 +22,15 @@
 	"author": "Eugene Sysmanov",
 	"license": "MIT",
 	"devDependencies": {
-		"@types/react": "^17.0.37",
-		"@types/react-router-dom": "^5.3.2",
+		"@types/react": "^18.0.8",
+		"@types/react-router-dom": "^5.3.3",
 		"tslint": "^6.1.3",
 		"tslint-react": "^5.0.0",
-		"typescript": "^4.5.4"
+		"typescript": "^4.6.4"
 	},
 	"dependencies": {
-		"react": "^17.0.2",
-		"react-dom": "^17.0.2",
-		"react-router-dom": "^6.1.1"
+		"react": "^18.1.0",
+		"react-dom": "^18.1.0",
+		"react-router-dom": "^6.3.0"
 	}
 }

package/src/generate-routes.tsx

@@ -16,7 +16,7 @@ export interface ISSRRoute {
 export interface IOptions {
 	pathname: string;
 	routes: ISSRRoute[];
-	notFoundComp?: () => React.FunctionComponentElement<{ mod: Promise<IJSXModule> }>;
+	notFoundComp?: any; // () => React.FunctionComponentElement<{ mod: Promise<IJSXModule> }>;
 }
 
 const generateRoutes = async (
@@ -56,6 +56,7 @@ const generateRoutes = async (
 					/>
 				);
 			})}
+			<Route key='nf' path='*' element={renderElement(null, options.notFoundComp)} />
 		</Routes>
 	);
 };