SolidJSS
SolidJS14mo ago
5 replies
ChrisThornham

Help Configuring SolidStart with Capacitor JS

I'm trying to turn a SolidStart project into a Capacitor app so I can create mobile apps for iPhone and Android.

I’m new to this and struggling to fully understand how to integrate Capacitor with my SolidStart app. I have a few questions I hope someone can help clarify:

1. Capacitor and SSR/CSR:
- Once a Capacitor app is packaged, it’s essentially a client-side app running on a mobile device. So, I’m assuming that my app must be CSR (Client-Side Rendered) when using Capacitor, not SSR (Server-Side Rendered), correct?

2. Index.html and Capacitor Configuration:
Capacitor requires a separate directory for built web assets (such as dist or
www
) and an
index.html
file at the root of this directory. I’ve read that the
index.html
file must have a <head> tag in order for Capacitor plugins to work properly.

Here’s where I’m confused:

- My SolidStart project has a <head> tag inside entry-server.tsx in the /src directory. Is this the correct place to make my edits for the <head> tag?
- Alternatively, do I need to configure the app.config.ts file in a certain way, then run
npm run build
, and then manually edit the
index.html
file that gets output by that build command?

3. Server Preset
What server preset should I use in app.config.ts?

export default defineConfig({
  ssr: true,
  server: { preset: "What goes here?" },
});


Thanks in advance for your help!
Was this page helpful?