聯 系 人:李總
聯系電話:13759574266
在線 QQ:89417157
郵箱:13759574266@qq.com
微信號:ynlongtou
地址:昆明市滇緬大道旁昆建路5號108智庫空間A座4樓
網站建設前端規整化的手段,主要包括編碼規范、JavaScript庫、組件工具箱和框架這4個方面。
下面介紹編碼規范這1個方面的細節。在項目前期,可以通過這方面來初始化前端工程的。
注意:規整化需要把握一個度,標準太高會拖慢項目進度,標準太低又達不到規整的目的,所以前端架構需要根據實際的團隊水平和項目周期制定規整化的標準。
需要特別強調的是,很多人一提到前端架構,總會陷入“原生開發還是使用腳手架”“Vue、React、Angular應該選擇哪一個”的苦惱之中。其實,沒有任何的基礎技術能保證最終的軟件質量。而架構設計的目的,是想要保證最終的軟件質量。相對于選擇什么基礎技術,制定規范化的標準才是架構設計更應該考慮的事情。
編碼規范
制定編碼規范是最簡單且最有效的整頓辦法,只需要開發團隊遵守一些規則就能很大程度上避免混亂。這里先不考慮使用框架的情況,只是單純地從網頁開發方面介紹一下編碼規范化的幾個參考點:
規范化目錄結構;
規范化前端資源文件使用,限制和分離HTML、CSS和JavaScript文件;
抽離通用部分,建立共用的JavaScript腳本和CSS主題文件;
規范化第三方插件的使用;
其他方面。
注意:雖然這里以原生網頁開發作為基礎,但是規整化需要注意的點是相似的。
1.規范化目錄結構
一般的前端目錄結構都是按JavaScript文件、CSS文件、HTML文件及資源文件分離的。
但是這樣的前端目錄結構不適合大型網站,因為大型網站有很多網頁,也有很多網頁資源,如果還是按這種目錄結構組織網頁資源的話,那么前端的目錄結構其實還是混亂的。試想一下,HTML文件有幾十甚至上百個,伴隨的網頁資源也有幾百個,這種“幾十甚至上百個文件的羅列”無論在開發上還是網頁發布上,都極有可能造成不必要的人為失誤。
因此,在結構上層,最好再增加一層結構。增加一層結構后,能大大降低每個子目錄的文件數,可以把每個目錄的文件數控制在十幾二十個左右,從而規整前端結構。如圖3.25所示,根據用戶角色,增加了user(普通用戶)和admin(管理員)的網頁劃分。需要注意的是,網頁的劃分更多是以業務架構的子模塊為基礎的,需要根據實際情況而定。
增加結構后,在瀏覽器中輸入網址或IP地址后無法顯示默認網頁,這時需要設置一下默認網頁。設置默認網頁的方法有兩種,第一種是新增一個index.html文件,做強制跳轉;第二種是更改Web服務器的配置。
第一種方法是重定向,強制跳轉。由于Web服務器的默認配置是打開根目錄下的index.html文件,所以我們在根目錄下新建index.html文件,通過index.html文件自動跳轉到指定的新網頁。index.html文件的內容如代碼3.12所示,其中/sample/abc.html為要設定的默認網頁。
第二種方法是更改Web服務器的配置。以Nginx為例,修改conf/nginx.conf中的配置即可。
不過,雖然第二種方法的配置能讓默認網頁的地址保持簡潔,但是HTML文件引用其他網頁資源時,需要把相對地址改成絕對地址。
說明:一般的默認網頁為/index.html(網站根目錄下的index.html),在只輸入網址或IP地址的情況下會自動打開index.html網頁,這是Web服務器的配置決定的。
更多云南龍頭科技有限公司網站案例請查看:http://www.www.charti.com.cn/case.asp?id=3
云南龍頭科技有限公司憑借多年的網站建設經驗,堅持以“幫助中小企業實現網絡營銷化”為宗旨,成功幫助多家中小企業實現互聯網信息化建設,得到了客戶的一致好評。如你有任何關于網站建設的疑問,請立即點擊咨詢云南龍頭科技有限公司資深營銷專家或撥打咨詢熱線:13759574266,我們會詳細為你一一解答你心中的疑難。

掃描關注官方微信