Skip to content

feat(init): refresh Pages starter templates - #584

Open
yangshun wants to merge 3 commits into
voidzero-dev:mainfrom
yangshun:codex/update-void-starter-template-ui
Open

yangshun wants to merge 3 commits into
voidzero-dev:mainfrom
yangshun:codex/update-void-starter-template-ui

Conversation

@yangshun

@yangshun yangshun commented Oct 25, 2026 •

Copy link
Copy Markdown
Contributor

Summary

Replace the plain void init welcome pages with a shared Vite-style layout for React, Vue, Svelte, and Solid, using Void colors, system fonts, and automatic light/dark mode.

Preserve the original Pages-mode guidance and the database starters' message list, form, API example, and seed instructions. Bundle a small stack SVG and a theme-aware Void logo with void, with Vite attribution embedded in the icon sprite.

Keep the shared starter styles in a CSS source file and inline the raw CSS into the CLI bundle, with matching type declarations and build/test configuration.

Caution

This ships the SVG files with the core void package. I'm not a fan of this but the starter code is already implemented within void and since the files are just a few KB + not bundled into the build, it's not terrible.

My preference would be to shift the starter code and assets into create-void, but then void init will have to call create-vite, creating a circular dep. I'm not sure why void init needs to exist when there's create-void. Maybe it can be removed?

Examples

Screenshots from the four generated apps. React and Vue include database-backed message forms; Svelte and Solid use Static Pages.

React Vue
React starter Vue starter
Svelte Solid
Svelte starter Solid starter

Validation:

  • CI=true vp run test: 734 test files and 14,499 tests passed; 31 tests skipped.
  • vp run check: all 33 typecheck tasks passed.
  • Targeted lint and formatting checks passed.
  • Rebuilt CLI smoke test confirms generated pages/style.css matches starter-ui.css byte-for-byte.
  • Browser-verified the stack illustration and both Void logos in light and dark mode.

Copy link
Copy Markdown
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This PR ships the SVG files with the core void package. This means every Void user will have these SVGs in their node_modules. Not ideal IMO.

I'm not a fan of this, but since the starter code is already implemented within void/src/cli/template.ts and since the logos are just a few KB and doesn't enter a built bundle, it's not that terrible.

My preference would be to shift the starter code and assets into create-void, but then void init will have to call create-vite, creating a circular dep. I'm not sure why void init needs to exist when there's create-void. Maybe it can be removed?

@yangshun
yangshun marked this pull request as ready for review October 25, 2026 12:19
@yangshun
yangshun requested a review from a team as a code owner October 25, 2026 12:19

This branch has not been deployed

No deployments
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant