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：作者對編輯器的實現有比較深入的研究，可以去了解下