基於 vue-element-admin 高效開發後臺管理系統

晚星晨發表於2019-12-17

vue-element-admin 是一個後臺前端解決方案,它基於 vue 和 element-ui 實現。 它使用了最新的前端技術棧,提煉了典型的業務模型,提供了豐富的功能元件,它可以幫助你快速搭建企業級中後臺產品原型。相信不管你的需求是什麼,本專案都能幫助到你。

喜歡專案的請給個你的小星星

專案預覽

基於 vue-element-admin 高效開發後臺管理系統

基於 vue-element-admin 高效開發後臺管理系統

基於 vue-element-admin 高效開發後臺管理系統

基於 vue-element-admin 高效開發後臺管理系統

基於 vue-element-admin 高效開發後臺管理系統

基於 vue-element-admin 高效開發後臺管理系統

基於 vue-element-admin 高效開發後臺管理系統

基於 vue-element-admin 高效開發後臺管理系統

基於 vue-element-admin 高效開發後臺管理系統

基於 vue-element-admin 高效開發後臺管理系統

基於 vue-element-admin 高效開發後臺管理系統

基於 vue-element-admin 高效開發後臺管理系統

基於 vue-element-admin 高效開發後臺管理系統

基於 vue-element-admin 高效開發後臺管理系統

超強元件

基於 element-ui 封裝的 一些元件

專案地址 元件文件

輕量級超級 css 工具

它的痛點

  • 對於每一個div 我們都要寫對應的css類。 這個在開發的過程中非常浪費時間,並且不好維護。

用scss公共庫實現樣式和業務元件解耦, 快速提高開發效率! 對於每一個div 我們都要寫對應的css類。 這個在開發的過程中非常浪費時間,並且不好維護。

我們發現專案的樣式和元件耦合,導致每一個元件都有大量的css ,在這些css中絕大部分都是font-size、 padding 、margin、flex、color... 我們能不能像個辦法 把這些常用的樣式全部整合,這樣我們就可以把所有的樣式都從公共類中引用了。

把高頻的樣式整合到一個公共樣式檔案中

我們做了一個公共樣式檔案, 幾乎所有高頻的css都放進去了。

真實的使用體驗 對於一般管控系統 比如基於element-ui 基本可以做到幾乎不用寫額外的樣式 對於H5 css樣式數量也幾乎可以做到減少一半

  • 只需要引入一個公共檔案 足夠簡單
  • 幾乎每一個專案都能用到這些公共樣式 使用足夠高頻
  • 自從用了它,可以早點下班啦!
  • 一次生成,到處複製。

說有的 class 字首都是 cc-***

專案地址

超級簡潔的element的layout柵格化佈局

基於element主題提取出來的. 輕量級超級簡單的element的layout柵格化佈局 在你使用了element框架時不需要使用這個框架 Layout 佈局 通過基礎的 24 分欄,迅速簡便地建立佈局。

專案地址

演示地址

基於 vue-element-admin 高效開發後臺管理系統

喜歡專案的請給個你的小星星,謝謝大家了

本專案都是在工作業餘從網路借鑑過來的,不喜勿噴, 謝謝大家了

相關文章