Formily
A form library for React and Vue that handles complex and JSON-schema-driven forms.
- Stars
- 12.6k
- Forks
- 1.6k
- Licence
- MIT
- Language
- TypeScript
- Last update
- 1.4 years ago
- Type
- Library
No commits in over a year — check for forks or alternatives before adopting.
What it is
Formily is a TypeScript form library that helps developers build forms in React, React Native, Vue 2, and Vue 3. It manages each field's state separately so large forms with many linked fields don't re-render the whole page. It also supports JSON Schema, so forms can be described as data, for example by a back end.
- Build a form whose fields show or hide based on other field values
- Render a form from a JSON Schema definition returned by an API
- Use Ant Design or Alibaba Fusion inputs in a form that works out of the box
- Design forms visually with the Form Builder (Designable)
Great for
- Frontend developers building data-heavy forms with many linked fields
- Teams that want forms generated from JSON Schema sent by a back end
- Projects already using Ant Design or Alibaba Fusion components
- Teams that want a visual form builder (Designable) alongside the library
Not ideal for
- Simple forms with a few inputs, where a lighter library is enough
- Projects not using React or Vue, since the README lists only those frameworks
- Non-developers who want a no-code form tool; the README describes it as a developer library
How to get it
- 1
Install with a package manager
You'll need: Node.js · npm or yarn
Install the core package
npm install @formily/core - 2
Run it
- Read the official guide at https://formilyjs.org
- Install the package for your framework (React or Vue) as described in the docs
- Create a form instance and render your first field
- Try the Form Builder at https://designable-antd.formilyjs.org/ to see generated forms
- 3
Get the most out of it
- Use JSON Schema when the back end should control the form layout
- Pair with Ant Design or Alibaba Fusion components for ready-made inputs
- Use the Form Builder to prototype forms quickly
- Use the side-effect handling described in the README to build field linkage
Downloads
Strengths
- The README says field state is managed independently, which aims to avoid slow re-renders in linked forms
- Supports converting between JSON Schema and its own JSchema format
- Released under the permissive MIT license
Trade-offs
- The README is short and covers little API detail, so setup needs the official documentation site
- The README mentions two website versions (1.0 and 2.0), so check you are reading the right docs
How it compares
| Project | Stars | Type | Level | Updated | Best for |
|---|---|---|---|---|---|
| formily (this) | 12.6k | Library | intermediate | 1.4 years ago | Frontend developers building data-heavy forms with many linked fields |
| react-hook-form | 44.9k | Library | intermediate | 5 days ago | React developers building forms with several fields |
| vee-validate | 11.3k | Library | intermediate | 8 months ago | Vue developers who need form validation without writing it from scratch |
| vue-admin-better | 18.9k | App | intermediate | 17 days ago | Front-end developers with about a year of experience who want an admin panel starting point |
| vueuse | 22.4k | Library | beginner | 6 days ago | Vue 3 developers who repeat common browser logic across projects |
| soybean-admin | 15.2k | Library | intermediate | 16 days ago | Developers starting a new internal admin or back-office web app with Vue 3 |
Stats synced from GitHub. The assessment above was drafted with AI from the project's README on 2026-10-29 and may miss recent changes — check the README before relying on a command. MIT licence: free to use, modify and distribute, including commercially, as long as you keep the copyright notice.