Chapter 2: Installation

Core Idea

Each framework gets its own npm package; there is no single umbrella install. Meta-framework SSR helpers and devtools ship as further separate, optional packages.

Key Concepts

• Per-framework core packages: @tanstack/react-form, @tanstack/vue-form, @tanstack/angular-form, @tanstack/solid-form, @tanstack/lit-form, @tanstack/svelte-form.
• React meta-framework adapters: @tanstack/react-form-start (TanStack Start), @tanstack/react-form-nextjs (Next.js), @tanstack/react-form-remix (Remix) — each wraps mergeForm/createServerValidate conventions for that framework's server-action model (ch022).
• Devtools are opt-in dev dependencies, not bundled — @tanstack/react-devtools + @tanstack/react-form-devtools for React, @tanstack/solid-devtools + @tanstack/solid-form-devtools for Solid (ch024).
• Older/edge environments may need polyfills; the docs don't pin an exact browser support matrix.

Reference Tables

Framework	Package
React	@tanstack/react-form
Vue	@tanstack/vue-form
Angular	@tanstack/angular-form
Solid	@tanstack/solid-form
Lit	@tanstack/lit-form
Svelte	@tanstack/svelte-form

Code Examples

npm i @tanstack/react-form
# meta-framework SSR helper, if needed:
npm i @tanstack/react-form-nextjs

• What it demonstrates: core install plus the optional Next.js SSR adapter — install only the meta-framework package you actually target.

Key Takeaways

1. Pick exactly one core package for your framework — don't install react-form alongside another framework's package.
2. If you're on TanStack Start, Next.js, or Remix and need server-side form validation, install the matching -start/-nextjs/-remix package rather than hand-rolling mergeForm wiring (ch022).
3. Devtools are development-only installs; don't ship them to production bundles.

Connects To

• Ch022 SSR & Meta-Frameworks: what the meta-framework packages are for.
• Ch024 Devtools: setting up the devtools packages listed above.
• Ch005 TypeScript: version/tsconfig requirements on top of installation.