《GitHub精選》是我們分享GitHub中優(yōu)質項目的欄目，包括技術、學習、實用與各種有趣的內容。本期推薦的是一個場景化低代碼（LowCode）搭建工作臺——Sparrow。

Sparrow是一套場景化低代碼搭建頁面的工作臺，通過預置組件簡單拖拉拽就能快速搭建頁面，制作完畢后即可在線調試即時體驗，實時修改，頁面效果所見即所得，并且支持生成源代碼。

主要功能：

• 低代碼開發(fā)，快速生成可讀性強、vue element-ui組件庫的源代碼
• 可視化開發(fā)，通過GUI生成頁面代碼源文件
• 資產(chǎn)市場，代碼資源共享，包含組件、編輯區(qū)塊、靜態(tài)區(qū)塊、搜索組件

工作原理：

• 首先選擇場景編輯器（表單、表格、區(qū)塊等），場景編輯器渲染到頁面
• 通過特定場景編輯器選擇物料（組件、區(qū)塊），選擇動作傳到服務器端
• 服務器端生成源代碼，輸出源代碼到預覽項目中
• 預覽項目通過webpack熱更新實時展示效果

安裝：

• 全局安裝

# 全局安裝$ 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：https://github.com/sparrow-js/sparrow