web前端開發規範

前端開發規範 :

  1. 代碼規範

    1.1 寫符合eslint規範的代碼

    1.2 能以背景形式呈現的圖片, 儘量寫入css樣式中; 重要圖片必須加上alt屬性; 給重要的元素和截斷的元素加上title;

    1.3 代碼中一次縮進2個空格

    1.4 語義化書寫自定義標籤或變量(禁止出現 a b 1 2 3這種無實際意義的代碼)

    1.5 無特殊情況下統一用駝峯書寫代碼(不要人爲縮短命名到最小除了傳統的 for 循環中的計數器 i 等簡化的情況,變量命名必須長到有明確意義)

    1.6 儘可能多的在代碼中添加註釋,書寫一致並且可讀的註釋,編寫可維護性高,易於維護的代碼

    1.7 html中屬性的值使用雙引號 js中屬性的值使用單引號

    1.8 css中減少不必要的嵌套,儘量不超過4層

    1.9 盡力編寫可通用化的函數,讓它接受參數並返回值。這樣有利於充分的代碼重用,而且一旦與引入及外部腳本配合起來,能在腳本需要修改時減少開銷。例如,相比

硬編碼一個帶有窗口大小、選項和url的彈出式窗口,不如編寫一個接受大小、url和選項作爲變量的函數。 給代碼添加註釋!這會有利於減少在調試Javascript函數上花費的時間

1.10 最小化全局變量 - 你創建的全局變量越少越好。任何全局變量明確指認:window.xxx =(儘可能的選擇 let 或 const 避免內存污染)

1.11 不限和全部的下拉選擇統一由前端手動加  傳給後端默認爲 -1

1.12 時間格式統一傳時間戳(毫秒)

2.提交規範

2.1.  提交的代碼不能有報錯信息

2.2.  提交代碼備註信息需要註明提交內容

    . feat :新功能 

        . fix :修復bug  

        . doc : 文檔改變

        . style : 代碼格式改變

        . refactor :某個已有功能重構

        .perf :性能優化

        .test :增加測試

        . build :改變了build工具 如 grunt換成了 npm

        .revert: 撤銷上一次的 commit 

3.文件規範

3.1. 使用駝峯方式命名文件名與文件所在的文件夾,便於統一配置;

3.2. 確保文件命名總是以字母開頭而不是數字;

3.3. 特殊含義的文件,需要對文件增加前後綴或特定的擴展名(比如 .min.js, .min.css),抑或一串前綴(比如 all.main.min.css)。使用點分隔符來區分這些在文

件名中帶有清晰意義的元數據。

4.項目規範(vue)

4.1 src文件下 assets 統一放置靜態資源

4.2 src文件下 components 放置公用組件以內置文件夾名對應模塊名  公用的命名統一爲public  每個模塊內如有組件規則同上

4.3 全局過濾器統一寫在  src文件下 filter內

4.4 全局工具類統一寫在  src文件下 utils內

4.5 src文件下 router目錄結構必須按模塊書寫

4.5 router文件內 meta標籤內必須要有title屬性
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章