前端編碼規(guī)范

xushaojieaaa 發(fā)布于2019-08-01 15:02 / 912人閱讀

摘要：前言首先，寫(xiě)這篇代碼規(guī)范是為了我自己在以后的項(xiàng)目中方便引用，讓前端人員統(tǒng)一標(biāo)準(zhǔn)，方便在開(kāi)發(fā)中保持代碼的一致性，代碼規(guī)范是在的編碼規(guī)范上的基礎(chǔ)上做的修改，下面只列舉出一些不一樣的地方，基本的規(guī)范參照編碼規(guī)范要求使用。

前言

首先，寫(xiě)這篇代碼規(guī)范是為了我自己在以后的項(xiàng)目中方便引用，讓前端人員統(tǒng)一標(biāo)準(zhǔn)，方便在開(kāi)發(fā)中保持代碼的一致性，代碼規(guī)范是在bootstrap的編碼規(guī)范上的基礎(chǔ)上做的修改，下面只列舉出一些不一樣的地方，基本的規(guī)范參照bootstrap編碼規(guī)范

IDE要求使用webstorm。

語(yǔ)法

用四個(gè)空格來(lái)代替制表符（tab）,嵌套元素應(yīng)當(dāng)縮進(jìn)一次（即四個(gè)空格），大部分人習(xí)慣JS為4個(gè)空格的縮進(jìn)，讓HTML，CSS和JS保持一致，webstorm默認(rèn)的代碼格式化就可以達(dá)到四個(gè)空格的縮進(jìn)，快捷鍵Ctrl+Alt+L

命名規(guī)則

文件命名規(guī)則：英文單詞，多單詞使用“-”連接,或小駝峰方法

    index.html
    task-bg.jpg
    title-bg.png
    project-task.css
    project-ctrl.js
    projectCtrl.js

Css類名命名規(guī)則：英文單詞，多單詞使用“-”連接

    
        
            這里是標(biāo)題

Javasctipt命名規(guī)則：小駝峰

    $scope.taskOpen = function () {
        $scope.taskOpenState = true;
    };

代碼格式化

使用webstorm作為IDE，使用默認(rèn)的代碼格式化方式，快捷鍵為ctrl+alt+l
把webstorm的格式化換行去掉，以11.0.2版本為例，

設(shè)置方法：找到File-Settings-Editor-General-Appearance
 去掉Show right margin(configured in Code Style options)的勾選

其他書(shū)寫(xiě)規(guī)范

標(biāo)簽中href屬性不使用#作為填充，使用javascript:,例如：

云服務(wù)器 GPU云服務(wù)器規(guī)范編碼編碼規(guī)范 php編碼規(guī)范 js安全編碼規(guī)范

文章版權(quán)歸作者所有，未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請(qǐng)注明本文地址：http://systransis.cn/yun/49718.html

相關(guān)文章

前端編碼規(guī)范之：樣式（scss）編碼規(guī)范

摘要：前端編碼規(guī)范之使用規(guī)范前端編碼規(guī)范之樣式編碼規(guī)范前端編碼規(guī)范之結(jié)構(gòu)規(guī)范前端編碼規(guī)范之最佳實(shí)踐前端編碼規(guī)范之編碼規(guī)范命名的原則是通俗易懂，盡量保持不重復(fù)沖突，盡量不要用。我覺(jué)得應(yīng)該避免出現(xiàn)出現(xiàn)這種方式用預(yù)處理器拼接出來(lái)的名稱，會(huì)生成。前端編碼規(guī)范之：Git使用規(guī)范前端編碼規(guī)范之：樣式（scss）編碼規(guī)范前端編碼規(guī)范之：HTML結(jié)構(gòu)規(guī)范前端編碼規(guī)范之：Vue最佳實(shí)踐前端編碼規(guī)范...

reclay 2019-08-29 16:58 評(píng)論0 收藏0
前端編碼規(guī)范

摘要：前言首先，寫(xiě)這篇代碼規(guī)范是為了我自己在以后的項(xiàng)目中方便引用，讓前端人員統(tǒng)一標(biāo)準(zhǔn)，方便在開(kāi)發(fā)中保持代碼的一致性，代碼規(guī)范是在的編碼規(guī)范上的基礎(chǔ)上做的修改，下面只列舉出一些不一樣的地方，基本的規(guī)范參照編碼規(guī)范要求使用。前言首先，寫(xiě)這篇代碼規(guī)范是為了我自己在以后的項(xiàng)目中方便引用，讓前端人員統(tǒng)一標(biāo)準(zhǔn)，方便在開(kāi)發(fā)中保持代碼的一致性，代碼規(guī)范是在bootstrap的編碼規(guī)范上的基礎(chǔ)上做的修改，...

nicercode 2019-08-19 17:20 評(píng)論0 收藏0
前端編碼規(guī)范

摘要：前言首先，寫(xiě)這篇代碼規(guī)范是為了我自己在以后的項(xiàng)目中方便引用，讓前端人員統(tǒng)一標(biāo)準(zhǔn)，方便在開(kāi)發(fā)中保持代碼的一致性，代碼規(guī)范是在的編碼規(guī)范上的基礎(chǔ)上做的修改，下面只列舉出一些不一樣的地方，基本的規(guī)范參照編碼規(guī)范要求使用。前言首先，寫(xiě)這篇代碼規(guī)范是為了我自己在以后的項(xiàng)目中方便引用，讓前端人員統(tǒng)一標(biāo)準(zhǔn)，方便在開(kāi)發(fā)中保持代碼的一致性，代碼規(guī)范是在bootstrap的編碼規(guī)范上的基礎(chǔ)上做的修改，...

gggggggbong 2019-08-28 18:29 評(píng)論0 收藏0
前端、HTML+CSS+JS編寫(xiě)規(guī)范（終極版）

摘要：文檔規(guī)范和文檔必須采用編碼格式文檔必須使用的標(biāo)準(zhǔn)文檔格式編寫(xiě)規(guī)范和的標(biāo)簽屬性類名都必須使用小寫(xiě)字母和的屬性類名命名必須具有語(yǔ)義化代碼必須保持文檔結(jié)構(gòu)清晰，必須合理的進(jìn)行代碼縮進(jìn)文件禁止樣式表內(nèi)引用文件編寫(xiě)格式，樣式代碼保持一行，多個(gè)選擇器 HTMLCSS文檔規(guī)范 HTML和CSS文檔必須采用UTF-8編碼格式； HTML文檔必須使用HTML5的標(biāo)準(zhǔn)文檔格式； HTMLCSS編寫(xiě)規(guī)范...

jsyzchen 2019-08-01 18:15 評(píng)論0 收藏0
前端、HTML+CSS+JS編寫(xiě)規(guī)范（終極版）

摘要：文檔規(guī)范和文檔必須采用編碼格式文檔必須使用的標(biāo)準(zhǔn)文檔格式編寫(xiě)規(guī)范和的標(biāo)簽屬性類名都必須使用小寫(xiě)字母和的屬性類名命名必須具有語(yǔ)義化代碼必須保持文檔結(jié)構(gòu)清晰，必須合理的進(jìn)行代碼縮進(jìn)文件禁止樣式表內(nèi)引用文件編寫(xiě)格式，樣式代碼保持一行，多個(gè)選擇器 HTMLCSS文檔規(guī)范 HTML和CSS文檔必須采用UTF-8編碼格式； HTML文檔必須使用HTML5的標(biāo)準(zhǔn)文檔格式； HTMLCSS編寫(xiě)規(guī)范...

_Dreams 2019-08-22 11:23 評(píng)論0 收藏0