elementUi原始碼解析 1 專案結構篇

2022-01-16 10:19:31 字數 964 閱讀 3775

因為在忙其他事情好久沒有更新iview的原始碼,也是因為後面的一些元件有點複雜在考慮用什麼方式把複雜的功能邏輯簡單的展示出來,還沒想到方法,突然想到element的元件基本也差不多,內部功能的邏輯也差不多,就一起來看原始碼,element用的css預處理器是sass。

個人還是比較喜歡iview的專案結構(iview原始碼解析(1)),感覺更清晰一點,專案結構的目的還是有序的管理**,根據團隊實際習慣選擇哪種結構。index.js的元件註冊和iview的差不多,這裡就不重複了。

element的樣式用的是sass,而且在class的命名上和iview有點差別。

element的樣式:

@include when(disabled) 

}.el-input__icon

}

在看下最後編譯的class命名:

.el-input--medium .el-input__inner 

.el-input--suffix .el-input__inner

iview的樣式**:

// prefix & suffix

&-prefix, &-suffix

}&-suffixi}

命名也帶有b、e、m的意思但中間是-分開。

湊點文字篇幅,把ant design of react的專案結構也奉上把。

ant design of react的樣式的命名規則和iview差不多也是用less,就不多說了。

elementUi原始碼解析 1 專案結構篇

因為在忙其他事情好久沒有更新iview的原始碼,也是因為後面的一些元件有點複雜在考慮用什麼方式把複雜的功能邏輯簡單的展示出來,還沒想到方法,突然想到element的元件基本也差不多,內部功能的邏輯也差不多,就一起來看原始碼,element用的css預處理器是sass。build 放置webpack的...

Qt原始碼解析 1

本文 感謝原創者分享 如果你閱讀了 qt 的源 你會看到一堆奇奇怪怪的巨集,例如 q d,q q。我們的qt原始碼之旅就從理解這些巨集說起。下面先看乙個c 的例子。cpp class person person string name void setname string name int age...

jquery原始碼解析1

學了很久的js也寫了很長時間的jquery了,這裡來以學習的態度來看大牛的思想和架構。使用的是當前最新版本 3.1.1 就不考慮煩人的ie 6 7 8了,輕鬆愉快。其實一上來不知所措,這都是啥?function global,factory return factory w else typeof ...