vue-design 桌面端頁面可視化構建程序

vue-design

用Vue和Electron開發最好的頁面可視化構建程序

Your star is the greatest encouragement to me.

功能

• 使用electron構建的桌面端應用
• 經過簡單的配置引入UI組件庫
• 經過可拖拽、可編輯的組件設計頁面
• 可編輯頁面css
• 保存爲.vue文件
• 保存/導入一個項目

✨ 下載

• Windows：百度網盤
• Mac：

綜述

本項目的初衷有二：

• 是減小中後臺應用的開發成本
• 經過類axure的功能，讓設計師的設計稿生成初步的.vue文件代碼，打通設計師和前端間的隔閡

對於第一點，相信很多大公司有不少實踐。例如阿里開源的ice工具走得是代碼塊複用的思路，很是值得借鑑。

而對於第二點，目前開源的也有很多項目，但都是基於web的。在我看來，可視化構建須要和文件進行強交互，因此我選擇了vue和electron去開發一個桌面端應用。

目前，這個項目仍是雛形，但已具有基本的功能，在代碼實現上在目前vue的幾個項目中是最簡潔的（這也多得前人的經驗）。這個項目我會長期跟進，有興趣的求關注下：）

RoadMap

• 更多內置佈局、區塊和元件 (2018/03-2018/04)
• 檢測.vue文件改動並自動同步到項目中 (2018/04)
• 物料市場 (2018/04)
• 自定義插件和插件市場 (2018/05)

最後

本人會在4月份求職，廣州地區，有好坑的話，求介紹：)

Github：L-Chris

若對vue/react對頁面可視化構建有興趣的，能夠參考如下開源項目：

Vue

• vue-design：本項目地址，求star：)
• vuep：實時編輯組件代碼並預覽
• Vue-Layout：拖拽，修改，預覽代碼等基本功能，思想比較好理解，能夠當入門瞭解下
• esview：除基本功能外，結合了後端進行組件上傳/下載功能，代碼質量相對高點

React

• ice：阿里官方項目，主要走的是物料複用的思路
• gaea-editor：做者對編輯器的實現有比較深刻的研究，能夠去了解下