vite-vue3-lowcode/README.md

base on Vite2.x + Vue3.x + TypeScript H5 Low code platform

English | 中文

Clone the main branch and ignore irrelevant branches such as git-pages

git clone --single-branch https://github.com/buqiyuan/vite-vue3-lowcode.git
# or
git clone --single-branch https://gitee.com/buqiyuan/vite-vue3-lowcode.git

technology stack

• Programming Language：TypeScript 4.x + JavaScript
• Build Tools：Vite 2.x
• Front End Frame：Vue 3.x
• Subnet Calculator：Vue Router 4.x
• State Management：Vuex 4.x
• PC UI Frame：Element Plus
• H5 UI Frame：vant
• CSS Pre：Stylus / Sass / Less
• HTTP Tool：Axios
• Git Hook 工具：husky + lint-staged
• Coding Standards：EditorConfig + Prettier + ESLint + Airbnb JavaScript Style Guide
• Submit Specifications：Commitizen + Commitlint
• Unit Testing：vue-test-utils + jest + vue-jest + ts-jest
• Auto Deploy：GitHub Actions

Function List

• Add pages dynamically
• Drag and drop components
• service worker + indexeddb Implement server-free front-end interaction
• DataSource Admin Console
• Provide preset functions
• More component encapsulation
• Others...

Generate component properties quickly

// 在vant文档中 chrome控制台输入以下代码，快速生成组件属性
let propObj = {
  string: (config) => `createEditorInputProp(${JSON.stringify(config)})`,
  number: (config) => `createEditorInputNumberProp(${JSON.stringify(config)})`,
  boolean: (config) => `createEditorSwitchProp(${JSON.stringify(config)})`
}

$$('#props + table tr').reduce((prev, curr) => {
  const children = curr.children
  const key = children[0].textContent.replace(/-([a-z])/g, (all, i) => i.toUpperCase())
  const value = (propObj[children[2].textContent] ?? propObj['string'])({
    label: `'${children[1].textContent}'`
  }).replaceAll('"', '')
  prev[key] = value
  return prev
}, {})

Browser support

The Chrome 80+ browser is recommended for local development

Support modern browsers, not IE

IE	Edge	Firefox	Chrome	Safari
not support	last 2 versions	last 2 versions	last 2 versions	last 2 versions

Git Contribution submission specification

• feat Add new features
• fix Fix the problem/BUG
• style The code style is related and does not affect the running result
• perf Optimization/performance improvement
• refactor Refactor
• revert Undo edit
• test Test related
• docs Documentation/notes
• chore Dependency update/scaffolding configuration modification etc.
• workflow Workflow improvements
• ci Continuous integration
• types Type definition file changes
• wip In development

QUICK START

Install and use

npm install
# or
yarn add

run

npm run dev

build

npm run build