參考文章
src // 存放源代碼
dist // distribution
的縮寫只锻，是指打包完畢可以分發(fā)或部署的文件咸灿，一般不會同時有build和dist的
tests // 測試用例代碼
build // 構(gòu)建完畢可以發(fā)布的代碼
├─build # 編譯后生成的所有代碼沮尿、資源（圖片、字體等空凸，雖然只是簡單的從源目錄遷移過來）
├─node_modules # 利用npm管理的所有包及其依賴
├─vendor # 所有不能用npm管理的第三方庫
├─.babelrc # babel的配置文件
├─.eslintrc # ESLint的配置文件
├─index.html # 僅作為重定向使用
├─package.json # npm的配置文件
├─webpack.config.js # webpack的配置文件
├─src # 當前項目的源碼
├─pages # 各個頁面獨有的部分嚎花，如入口文件、只有該頁面使用到的css劫恒、模板文件等
│ ├─alert # 業(yè)務模塊
│ │ └─index # 具體頁面
│ ├─index # 業(yè)務模塊
│ │ ├─index # 具體頁面
│ │ └─login # 具體頁面
│ │ └─templates # 如果一個頁面的HTML比較復雜贩幻，可以分成多塊再拼在一起
│ └─user # 業(yè)務模塊
│ ├─edit-password # 具體頁面
│ └─modify-info # 具體頁面
└─public-resource # 各個頁面使用到的公共資源
├─components # 組件，可以是純HTML两嘴，也可以包含js/css/image等，看自己需要
│ ├─footer # 頁尾
│ ├─header # 頁頭
│ ├─side-menu # 側(cè)邊欄
│ └─top-nav # 頂部菜單
├─config # 各種配置文件
├─iconfont # iconfont的字體文件
├─imgs # 公用的圖片資源
├─layout # UI布局，組織各個組件拼起來梳侨，因應需要可以有不同的布局套路
│ ├─layout # 具體的布局套路
│ └─layout-without-nav # 具體的布局套路
├─less # less文件金顿，用sass的也可以，又或者是純css
│ ├─base-dir
│ ├─components-dir # 如果組件本身不需要js的贰您，那么要加載組件的css比較困難坏平，我建議可以直接用less來加載
│ └─base.less # 組織所有的less文件
├─libs # 與業(yè)務邏輯無關(guān)的庫都可以放到這里
└─logic # 業(yè)務邏輯
