How to make full static generation

Hello, I'm trying to build a blog site using a JamStack like architecture.
I want to deploy it to Cloudflare Pages as a completely static site, including the API responses.
I wrote app.config.ts as follows and used the fetch method to get data from the API.
However, when I build and run the site, API requests using the values from process.env are made during the page load.
I want to save the API responses at build time, similar to the full static generation in Nuxt.js or Next.js, so that no API requests are needed after deployment.
How can I achieve this?

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

export default defineConfig({
  server: {
    prerender: {
      crawlLinks: true,
    },
    preset: "cloudflare-pages-static",
    static: true,
  },
  ssr: true,
});

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

export default defineConfig({
  server: {
    prerender: {
      crawlLinks: true,
    },
    preset: "cloudflare-pages-static",
    static: true,
  },
  ssr: true,
});

// src/routes/posts/[...id].tsx
  const fetchPost = async (id: string) => {
    const res = await fetch(`https://${process.env.SERVICE_DOMAIN}.microcms.io/api/v1/blog/${id}`, {
      headers: {
        'X-MICROCMS-API-KEY': process.env.API_KEY || '',
      },
    });

    const resJson = await res.json();
    if (!res.ok) {
      throw new Error(resJson.message);
    }

    return resJson;
  }

// src/routes/posts/[...id].tsx
  const fetchPost = async (id: string) => {
    const res = await fetch(`https://${process.env.SERVICE_DOMAIN}.microcms.io/api/v1/blog/${id}`, {
      headers: {
        'X-MICROCMS-API-KEY': process.env.API_KEY || '',
      },
    });

    const resJson = await res.json();
    if (!res.ok) {
      throw new Error(resJson.message);
    }

    return resJson;
  }

SolidJS•2y ago•

14 replies

seigo2016

How to make full static generation

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

export default defineConfig({
  server: {
    prerender: {
      crawlLinks: true,
    },
    preset: "cloudflare-pages-static",
    static: true,
  },
  ssr: true,
});

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

export default defineConfig({
  server: {
    prerender: {
      crawlLinks: true,
    },
    preset: "cloudflare-pages-static",
    static: true,
  },
  ssr: true,
});

// src/routes/posts/[...id].tsx
  const fetchPost = async (id: string) => {
    const res = await fetch(`https://${process.env.SERVICE_DOMAIN}.microcms.io/api/v1/blog/${id}`, {
      headers: {
        'X-MICROCMS-API-KEY': process.env.API_KEY || '',
      },
    });

    const resJson = await res.json();
    if (!res.ok) {
      throw new Error(resJson.message);
    }

    return resJson;
  }

// src/routes/posts/[...id].tsx
  const fetchPost = async (id: string) => {
    const res = await fetch(`https://${process.env.SERVICE_DOMAIN}.microcms.io/api/v1/blog/${id}`, {
      headers: {
        'X-MICROCMS-API-KEY': process.env.API_KEY || '',
      },
    });

    const resJson = await res.json();
    if (!res.ok) {
      throw new Error(resJson.message);
    }

    return resJson;
  }

How to make full static generation

Similar Threads

How to make full static generation

Similar Threads

Similar Threads

Similar Threads