Stedefast

The scaffold command generates boilerplate files in your theme or content directory. It reads your stedefast.config.ts where relevant (e.g. to detect your template engine) and writes the output file, refusing to overwrite an existing file without --force.

scaffold template

stedefast scaffold template <name>
stedefast scaffold template <name> --react
stedefast scaffold template <name> --liquid

Generates theme/templates/<name>.tsx (or .liquid). Without a flag, Stedefast reads the first engine listed in templateEngines from your config and picks the file extension accordingly. Pass --react or --liquid to override.

Generated React template:

// theme/templates/post.tsx
import type { PageContext } from "@stedefast/core";

export default function PostTemplate({ page, site }: PageContext) {
  return (
    <article>
      <h1>{page.frontMatter.title}</h1>
      <div dangerouslySetInnerHTML={{ __html: page.content }} />
    </article>
  );
}

Generated Liquid template:

<!-- theme/templates/post.liquid -->
<article>
  <h1>{{ page.frontMatter.title }}</h1>
  <div>{{ page.content }}</div>
</article>

scaffold layout

stedefast scaffold layout <name>

Generates theme/layouts/<name>.tsx — a full HTML shell that wraps your templates.

// theme/layouts/default.tsx
import type { PageContext } from "@stedefast/core";

interface LayoutProps extends PageContext {
  children: React.ReactNode;
}

export default function DefaultLayout({ page, site, children }: LayoutProps) {
  return (
    <html lang="en">
      <head>
        <meta charSet="utf-8" />
        <meta name="viewport" content="width=device-width, initial-scale=1" />
        <title>{page.frontMatter.title} — {site.title}</title>
        <link rel="stylesheet" href="/styles/global.css" />
      </head>
      <body>
        <main>{children}</main>
      </body>
    </html>
  );
}

scaffold partial

stedefast scaffold partial <name>

Generates theme/partials/<name>.tsx — a reusable component imported directly by templates and layouts.

// theme/partials/header.tsx
import type { SiteConfig } from "@stedefast/core";

interface HeaderProps {
  site: SiteConfig;
}

export default function Header({ site }: HeaderProps) {
  return (
    <header>
      <a href="/">{site.title}</a>
    </header>
  );
}

scaffold island

stedefast scaffold island <name>

Generates theme/islands/<name>.tsx — a client-side React component bundled and hydrated in the browser.

// theme/islands/Counter.tsx
import { useState } from "react";

interface CounterProps {
  initial?: number;
}

export default function Counter({ initial = 0 }: CounterProps) {
  const [count, setCount] = useState(initial);
  return (
    <button onClick={() => setCount(c => c + 1)}>
      Count: {count}
    </button>
  );
}

Mount it from any template with data-island:

<div data-island="Counter" data-props={JSON.stringify({ initial: 5 })} />

The difference between a custom island (created with this command) and a module island is that module islands are shipped inside a module package and ejected into your theme with scaffold module-island. Custom islands are a blank slate; module islands start with the module's own implementation and import their data hooks from the package.

scaffold type

stedefast scaffold type <name>

Generates content-types/<name>.ts — a Zod schema extending BaseFrontMatter that defines the frontmatter shape for a custom content type.

// content-types/project.ts
import { z } from "zod";
import { BaseFrontMatter } from "@stedefast/content";

export const ProjectFrontMatter = BaseFrontMatter.extend({
  client: z.string(),
  year: z.number(),
  tags: z.array(z.string()).default([]),
  featured: z.boolean().default(false),
});

export type ProjectFrontMatter = z.infer<typeof ProjectFrontMatter>;

import { defineConfig } from "@stedefast/core";
import { ProjectFrontMatter } from "./content-types/project";

export default defineConfig({
  // ...
  contentTypes: [
    { type: "project", schema: ProjectFrontMatter },
  ],
});

scaffold module-island

stedefast scaffold module-island <module-id>

Ejects a module's built-in island into theme/islands/, rewriting imports so they reference the module package directly. Supported module IDs: comments, claps, reactions, newsletter, contact, analytics, search.

See scaffold module-island for full details, flags, and error cases.