场景化低代码 牛啊

推荐一个开源项目：Sparrow，这是一个功能强大的场景化低代码搭建工作台，只需要在这个工作台上进行组件的拖拉拽，就能实时输出可读性强、vue element-ui 组件库的源代码。

这个工作台类似于这样，包含组件、编辑区块、静态区块、搜索业务组件、插件、场景搭建编辑器。中间是预览区域，区域中的数据面板、账单详情都是通过右侧的组件拖过来的。

如果你想实现一个数据面板、表单、卡片的前端 UI，不需要 Coding，只需拖拉拽就能实时预览网页效果，然后点击左上角的代码按钮就能一键生成源码。

该开源项目有丰富的组件，包含容器、布局、卡片、表单、按钮、选择框等。

作者描述：“ sparrow 的核心目标只有一条提升研发效率 ”。

虽然这句话还有待商榷，但是这个低代码开源项目功能上不只是单纯 UI 的可视化搭建，目前提供了函数级别的搭建，提供拥有业务逻辑的代码组装，生成可二次开发的源代码。

而且可与项目结合，技术上采用本地运行 server 服务，可以与项目深度结合，实现更多提效手段，更大可操作空间；

全局安装

# 全局安装
$ npm install -g sparrow-code

# 运行
$ sparrow

项目内安装

# 项目内安装
$ npm install sparrow-code -D

# package.json 增加 sparrow
"scripts": {
  "sparrow": "sparrow start -m page"
}

# 项目内安装GUI组件
$ npm install @sparrow-vue/develop-ui -S

# 项目内引用App.vue
<template>
  <div id="app">
    <router-view />
    <sparrow />
  </div>
</template>

<script>
import Sparrow from '@sparrow-vue/develop-ui'

export default {
  components: {
    Sparrow
  },
  name: 'App'
}
</script>

我把所有项目的地址放在了后台，关注微信公众号 「逛逛GitHub」，后台回复「0913」获取链接 。

推荐阅读