前端編碼規範

前言

首先，寫這篇代碼規範是爲了我本身在之後的項目中方便引用，讓前端人員統一標準，方便在開發中保持代碼的一致性，代碼規範是在bootstrap的編碼規範上的基礎上作的修改，下面只列舉出一些不同的地方，基本的規範參照bootstrap編碼規範

IDE要求使用webstorm。

語法

用四個空格來代替製表符（tab）,嵌套元素應當縮進一次（即四個空格），大部分人習慣JS爲4個空格的縮進，讓HTML，CSS和JS保持一致，webstorm默認的代碼格式化就能夠達到四個空格的縮進，快捷鍵Ctrl+Alt+L

命名規則

文件命名規則：英文單詞，多單詞使用「-」鏈接,或小駝峯方法

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

Css類名命名規則：英文單詞，多單詞使用「-」鏈接

<div class="task-list-title">
        <h3 class="task-list-title-h3">
            這裏是標題
        </h3>
    </div>

    <style>
        .task-list-title{
            float:left;
        }
    </style>

Javasctipt命名規則：小駝峯

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

代碼格式化

使用webstorm做爲IDE，使用默認的代碼格式化方式，快捷鍵爲ctrl+alt+l
把webstorm的格式化換行去掉，以11.0.2版本爲例，

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

其餘書寫規範

<a>標籤中href屬性不使用#做爲填充，使用javascript:,例如：

<a href="javascript:" ng-click="openPopbox()"></a>