Merge pull request #55 from neonexus/master

Fixed Webpack Dev Server reload issue

Author: neonexus

.idea/dictionaries/neonexusdemortis.xml

@@ -1,6 +1,12 @@
 # Changelog
 
-## [v3.0.0-beta](https://github.com/neonexus/sails-react-bootstrap-webpack/compare/v2.0.0...v3.0.0-beta.7) (2022-04-13)
+## [v3.0.0](https://github.com/neonexus/sails-react-bootstrap-webpack/compare/v2.0.0...v3.0.0) (2022-04-13)
+
+### Features
+
+* Fixed the reloading issue when using Webpack Dev Server.
+
+## [v3.0.0-beta](https://github.com/neonexus/sails-react-bootstrap-webpack/compare/v2.0.0...v3.0.0-beta.7) (2022-03-19)
 
 ### Features
 

CHANGELOG.md

@@ -11,12 +11,8 @@ The `master` branch is experimental, and the [release branch](https://github.com
 
 **FINAL WARNING: DO NOT RELY ON THE MASTER BRANCH!**
 
-# v3.0.0-beta Warning
-Moving from v5 -> v6 of the [React Router](https://reactrouter.com/) is a serious undertaking (see [the v5 -> v6 migration guide](https://reactrouter.com/docs/en/v6/upgrading/v5)).
-
-While basic features have been upgraded to the new standard of the new React Router, there are still some quirks while developing... When the assets are built for remote use (`npm run build` or `npm run build:dev`), everything works as expected; however, when working with the auto-reloading Webpack dev server, if you don't start from a "root" path (like "/admin" or "/main"), and refresh a path like "/admin/dashboard", things will not render.
-
-I'm still working on a fix for this.
+# v3.0.0 Warning
+Moving from v5 -> v6 of the [React Router](https://reactrouter.com/) can be a serious undertaking (see [the v5 -> v6 migration guide](https://reactrouter.com/docs/en/v6/upgrading/v5)).
 
 If you would like to use v5 of React Router, make sure you are cloning [v2 of this repo](https://github.com/neonexus/sails-react-bootstrap-webpack/tree/v2.0.0).
 

README.md

@@ -1,4 +1,4 @@
-import React from 'react';
+import React, {Suspense} from 'react';
 import {createRoot} from 'react-dom/client';
 import {
     BrowserRouter as Router,
@@ -15,14 +15,16 @@ function IndexApp() {
     // Sails will handle the webapp redirects in remote configurations.
     return (
         <Router>
-            <Routes>
-                <Route path="/admin/*" element={<AdminRouter />} />
-                <Route index path="/main/*" element={<Main />} />
-                <Route path="/" element={<Navigate to="/main" />} />
-            </Routes>
+            <Suspense fallback={<div>Loading...</div>}>
+                <Routes>
+                    <Route path="/admin/*" element={<AdminRouter />} />
+                    <Route index path="/main/*" element={<Main />} />
+                    <Route path="/" element={<Navigate to="/main" />} />
+                </Routes>
+            </Suspense>
         </Router>
     );
 }
 
 const root = createRoot(document.getElementById('root'));
-root.render(<IndexApp />, );
+root.render(<IndexApp />);

assets/src/index.jsx

@@ -1,6 +1,6 @@
 {
     "name": "sails-react-bootstrap-webpack",
-    "version": "3.0.0-beta.7",
+    "version": "3.0.0",
     "description": "An opinionated base configuration of Sails, with Webpack for React support, and Bootstrap for styling.",
     "keywords": [
         "sails",