建立统一的目录结构和使用规范的文件命名有助于其他人快速找到所需要的资源等。
##目录结构
- 静态页面目录结构
| 目录 | 存放文件 |
|---|---|
| 根目录 | HTML文件 |
| scss | SASS预编译文件 |
| img | 图片资源文件 |
| css | SASS编译完成文件 |
| js | JavaScript脚本文件 |
- PHP项目目录结构
PHP项目的静态资源统一放在项目下的webroot文件中的res文件夹中，页面全部放在protected文件中的views中的php文件中。
##SCSS文件结构
| 目录 | 存放文件 |
|---|---|
| 根目录 | 各个页面的样式（由各个文件夹的样式组装并加上页面的独有样式） |
| base | resset样式 |
| helps | 定义通用变量样式 |
| layout | 布局样式，如head、footer样式 |
| module | 组件样式，如轮播样式 |
| sprite | gulp的雪碧图生成样式 |
| utility | 部分功能性样式，如clearfix等样式 |
各个项目中不一定每个文件夹都有文件
scss文件最好根据不同页面分为common.scss和当前页面的scss文件，并将相同复用部分放入common.scss中
##文件命名规范
-
通用规范
-
命名以小写英文单词命名，多个单词命名时以下划线分隔，尽量不用缩写（除非是约定俗成或通用的缩写）
-
项目命名
-
全部采用小写方式， 以下划线分隔。
例：my_project_name
-
JS文件命名
-
参照项目命名规则。
例：account_model.js
-
CSS, SCSS文件命名
-
参照项目命名规则。
例：retina_sprites.scss
-
HTML文件命名
-
参照项目命名规则。
例：error_report.html