[Open Source] A Form Product Developed with Vue3 and Typescript, with All Source Code Fully Open Source

Open SourceClassification Systems

2026-06-28 09:07 5 次浏览 • 0 次下载 0KB

[Open Source] A Form Product Developed with Vue3 and Typescript, with All Source Code Fully Open Source

1. Project Overview

Lemon Form

Lemon Form is a form product developed using Vue3 and Typescript. As a frontend-heavyproduct, all source code for the form editor and form component library is fully open source.

2. Open Source License

Licensed under MIT

3. Screenshots

4. Feature Overview

Why Choose Lemon Form

Easy to Use
Drag-and-drop interactions reduce the learning curve
Dynamic Form Rendering
Easily create dynamic forms with minimal configuration.
Completely open-source
The core source code of the form editor is fully open source, giving you complete control over form development.
Extensibility
Lemon Form provides extensibility, and the official team also offers low-code code-generation capabilities, seamlessly enabling no-code development.

5. Tech Stack

Installation

Install Lemon Form using npm or yarn:

git clone lemon-form
cd lemon-form
yarn
npm run dev

Development Document

Code Structure

1. Editor Module

src/
├── views/                # Editor Module
│   ├── FormEditor/       # Main editor container
│   │   ├── comp-address-data.ts  # Address component configuration
│   ├── comp-data.ts        # Component library metadata
│   │   ├── comp-icon.ts        # Icon management system
│   │   ├── form-sidebar.vue    # Sidebar configuration items
│   └── form-setting.vue    # Property configuration panel
│   └── index.vue           # Editor entry point
│
├── components-form/      # Form component library
│   ├── advanced/         # Advanced components (such as dynamic forms)
│   ├── base/             # Basic form elements
│   ├── business/         # Business-specific components
│   └── contact-info/     # Contact information components
│
└── components-form-setting/ # Form configuration items
    ├── base/              # Basic property configuration
    ├── global/            # Global configuration items
    ├── validation/        # Validation rule configuration
    └── logic/             # Logic control configuration

下载地址免费

资源直链https://github.com/bojue/lemon-form

去下载