MicroDev
MicroDev
PostsComments
SSolidJS
Created by FatFreeButter on 4/29/2025 in #support
Compile specific routes into static html
Thanks @Madaxen86 and @exercise. I'm using SolidStart with Nitro as the underlying engine, and I'm explicitly defining certain routes to be pre-rendered. The build process generates both server-side and client-side bundles. However, I ignore the server-side output and only use the contents of .output/public. With some custom scripting and file rearrangement, I handle routing through the CDN to achieve the desired behaviour. For SPA fallback, I've defined an empty /spa-fallback route. I then modify the generated index.html from this route to match the main SPA index.html, effectively acting as a catch-all fallback. There are still a few bugs to resolve, particularly when porting a client-side rendered app to server-side rendering. One key issue is preventing the use of browser-specific APIs on pre-rendered routes. Is isServer the correct approach to guard components so that they only render in the browser, similar to use client directive?
12 replies
SSolidJS
Created by FatFreeButter on 4/29/2025 in #support
Compile specific routes into static html
Hi, I too am looking for a similar setup: Is there a way to implement pre-rendering with a SPA fallback as described in the React Router docs — but with multiple statically rendered entry points and, importantly, no server-side rendering (SSR)? The goal is to support fully static deployment. 
<Router root={...}>
  <Route path='/' pre-render />
  <Route path='/about' pre-render />
  <Route path='/course/:slug' />
</Router>
<Router root={...}>
  <Route path='/' pre-render />
  <Route path='/about' pre-render />
  <Route path='/course/:slug' />
</Router>
Outputs: 
dist/
├─ assets/
│  ├─ index.css
│  ├─ index.js
│  ├─ about.js
│  └─ course.js
├─ index.html
├─ about.html
└─ spa-fallback.html
dist/
├─ assets/
│  ├─ index.css
│  ├─ index.js
│  ├─ about.js
│  └─ course.js
├─ index.html
├─ about.html
└─ spa-fallback.html
12 replies