vite-express - npm Package Compare versions

Comparing version 0.10.0 to 0.11.0

dist/main.js

@@ -158,2 +158,14 @@ 'use strict';
 }
+function findClosestIndexToRoot(reqPath, root) {
+    const basePath = reqPath.slice(0, reqPath.lastIndexOf("/"));
+    const dirs = basePath.split("/");
+    while (dirs.length > 0) {
+        const pathToTest = path.join(root, ...dirs, "index.html");
+        if (fs.existsSync(pathToTest)) {
+            return pathToTest;
+        }
+        dirs.pop();
+    }
+    return undefined;
+}
 function injectViteIndexMiddleware(app, server) {
@@ -165,6 +177,9 @@ return __awaiter(this, void 0, void 0, function* () {
                 return next();
-            const template = fs.readFileSync(path.resolve(config.root, "index.html"), "utf8");
             if (isStaticFilePath(req.path))
                 next();
             else {
+                const indexPath = findClosestIndexToRoot(req.path, config.root);
+                if (indexPath === undefined)
+                    return next();
+                const template = fs.readFileSync(indexPath, "utf8");
                 const html = yield server.transformIndexHtml(req.originalUrl, template);
@@ -182,3 +197,6 @@ res.send(getTransformedHTML(html, req));
                 return next();
-            const html = fs.readFileSync(path.resolve(distPath, "index.html"), "utf-8");
+            const indexPath = findClosestIndexToRoot(req.originalUrl, distPath);
+            if (indexPath === undefined)
+                return next();
+            const html = fs.readFileSync(indexPath, "utf8");
             res.send(getTransformedHTML(html, req));
@@ -185,0 +203,0 @@ });

package.json

 {
   "name": "vite-express",
-  "version": "0.10.0",
+  "version": "0.11.0",
   "main": "dist/main.js",
@@ -5,0 +5,0 @@ "types": "dist/main.d.ts",

README.md

@@ -12,2 +12,3 @@ # ⚡ Vite + Express
 - [🚚 Shipping to production](#-shipping-to-production)
+- [📖 Multipage Apps](#-multipage-apps)
 - [🤖 Transforming HTML](#-transforming-html)
@@ -188,2 +189,35 @@ - [🤔 How does it work?](#-how-does-it-work)
 
+## 📖 Multipage Apps
+
+With Vite you can have multiple HTML entry points as described [here][vite-multipage].
+From v0.11.0 this feature is also supported by `vite-express`. Your app will automatically load correct `index.html` file when you navigate to path, just like in Vite.
+
+Suppose you have the following source code structure:
+
+```md
+├── package.json
+├── vite.config.js
+├── index.html
+├── main.js
+└── nested
+    ├── index.html
+    ├── nested.js
+    └── subroute
+        └─ index.html
+```
+
+When you navigate to any client-side route `vite-express` tries to find an `index.html` file matching request path as much as it is possible. What is means is that if you go to `/nested/subroute/my/secret/path`, files that `vite-express` will try to render are:
+
+1. `nested/subroute/my/secret/index.html`
+2. `nested/subroute/my/index.html`
+3. `nested/subroute/index.html`
+4. `nested/index.html`
+5. `index.html`
+
+In this case `nested/subroute/index.html` would be picked because that file exist, but in another case it would fall back to `nested/index.html`, and in case of another failure to root `index.html`. As soon as `nested/subroute/my/secret/index.html` will exist in the file structure, it can be used for this request.
+
+Why `nested/subroute/my/secret/path/index.html` isn't considered? Because it needs to have a trailing `/`. That's how Vite is doing it.
+
+Please remember that you still have to [configure `Vite`][vite-multipage] so that it will resolve all these files correctly in its build step.
+
 ## 🤖 Transforming HTML
@@ -360,1 +394,2 @@
 [outDir]: https://vitejs.dev/config/build-options.html#build-outdir
+[vite-multipage]: https://vitejs.dev/guide/build.html#multi-page-app

No alert changes

Improved metrics

Total package byte prevSize

33637

increased by7.37%

Lines of code

280

increased by6.87%

Number of lines in readme file

393

increased by9.78%

No dependency changes