SolidJS•4mo ago

SSG/SSR on specific paths for landing page

My main web app has SSR set to false, I would like my landing page to be SSG (or SSR) for SEO purposes, how can I achieve this in one solid start app here is my current app.config.ts

import { defineConfig } from '@solidjs/start/config'
import { cloudflare } from 'unenv'

export default defineConfig({
  vite: () => ({
    build: {
      target: 'es2020',
    },
  }),
  server: {
    preset: 'cloudflare-pages',
    unenv: cloudflare,
    rollupConfig: {
      external: ['__STATIC_CONTENT_MANIFEST', 'node:async_hooks'],
    },
    prerender: {
      routes: ['/'],
      ignore: ['/app/*', '/auth/*', '/api/*'],
    },
  },
  middleware: './src/middleware.ts',
  ssr: false,
})

import { defineConfig } from '@solidjs/start/config'
import { cloudflare } from 'unenv'

export default defineConfig({
  vite: () => ({
    build: {
      target: 'es2020',
    },
  }),
  server: {
    preset: 'cloudflare-pages',
    unenv: cloudflare,
    rollupConfig: {
      external: ['__STATIC_CONTENT_MANIFEST', 'node:async_hooks'],
    },
    prerender: {
      routes: ['/'],
      ignore: ['/app/*', '/auth/*', '/api/*'],
    },
  },
  middleware: './src/middleware.ts',
  ssr: false,
})

9 Replies

Madaxen86•4mo ago

Looks fine.

TheKnightCoderOP•4mo ago

how do i confirm/test its building correctly? I only see js files from the build output

Madaxen86•4mo ago

In .output/public should be: index.html index.html.br index.html.gz You can also preview locally with wrangler when using the cloudflare preset: https://nitro.unjs.io/deploy/providers/cloudflare#wrangler

Cloudflare - Nitro

Deploy Nitro apps to Cloudflare.

TheKnightCoderOP•4mo ago

I have the files index.html, index.html.br, index.html.gz in dist/ when i run vinxi build however the html has no static content within maybe i'm misunderstanding what prerendering does? I thought it would build static html but it seems to just give you javascript/solid code? if thats the case how do i enable ssr but have it disabled for my /app route guess i can wrap the whole app in import { clientOnly } from "@solidjs/start"; ??

Madaxen86•4mo ago

No, it actually does create a file containing the initial rendered HTML. And yes with cloudflare preset it’s in the dist directory. I’ve just checked with the most recent solid app and seems to work fine. Is the middleware interfering?

TheKnightCoderOP•4mo ago

just tested without the middleware and still not rendering HTML in the build code on the page is just

export default function App() {
  return <main class="">This is the landing page</main>
}

export default function App() {
  return <main class="">This is the landing page</main>
}

and in _build/assets i get the output

import{t}from"./web-BEH-7EHV.js";import"./solid-DHyVP8r9.js";var a=t('<main class="">This is the landing page');function i(){return a()}export{i as default};

import{t}from"./web-BEH-7EHV.js";import"./solid-DHyVP8r9.js";var a=t('<main class="">This is the landing page');function i(){return a()}export{i as default};

there's no html with This is the landing page in the build folder Okay I just started a new project and get the same issue 1. pnpm create solid (all defaults, basic template) & pnpm i 2. app.config.ts

import { defineConfig } from "@solidjs/start/config";

export default defineConfig({
  server: {
    preset: "cloudflare-pages",
    rollupConfig: {
      external: ["__STATIC_CONTENT_MANIFEST", "node:async_hooks"],
    },
    prerender: {
      crawlLinks: true,
      routes: ["/"],
    },
  },
  ssr: false,
});

import { defineConfig } from "@solidjs/start/config";

export default defineConfig({
  server: {
    preset: "cloudflare-pages",
    rollupConfig: {
      external: ["__STATIC_CONTENT_MANIFEST", "node:async_hooks"],
    },
    prerender: {
      crawlLinks: true,
      routes: ["/"],
    },
  },
  ssr: false,
});

3. pnpm run build

TheKnightCoderOP•4mo ago

Here is the dist/index.html

message.txt

ryansolid•4mo ago

I think it is because you have ssr: false It might only generate index.html and lack the ability to prerender other pages. We need server generated bundle to ssg pages Hmmm...

TheKnightCoderOP•4mo ago

yep that fixed it, setting ssr: true and now getting prerendered html ty @ryansolid 😄

Gaming

Programming

SSG/SSR on specific paths for landing page