一彤枢、模塊化的目的狰晚，就是便于多人協(xié)作開發(fā)，對于項目后期便于功能的擴展和修改
1堂污、ES6的到來家肯，使JS可以模塊化的組織代碼龄砰。
2盟猖、CSS 可以使用CSS Moudle技術(shù)來模塊化代碼。
二换棚、組件化的目的式镐，就是方便把復(fù)雜的頁面分割到每個組件中去實現(xiàn)，用分而治之的方式去解決問題固蚤。
用React視圖庫娘汞，就會很方便的用組件的方式搭建頁面。
三夕玩、規(guī)范化你弦，模塊化和組件化確定了開發(fā)模型，就需要規(guī)范去落實燎孟。
- 目錄結(jié)構(gòu)的制定
-- src # 源碼目錄
|__ index.js # 項目入口禽作，注入store, 調(diào)用render方法
|__ App.js # 應(yīng)用入口，頁面整體布局揩页，處理頁面路由
|__ App.less # 全局共用樣式文件
|__ theme.less # 項目主題文件
|__ Components
|__ ActiveChart # [組件ActiveChart ]
|__ index.js # 組件實現(xiàn)源碼文件
|__ index.less
|__ AxisTitle # [組件AxisTitle]
|__ index.js # 組件實現(xiàn)源碼文件
|__ index.less
|__ routes 定義應(yīng)用的頁面容器組件
|__ Cockpit # [頁面1]
|__ index.js # 頁面具體業(yè)務(wù)代碼
|__ indes.less
|__components 頁面的私有組件
|__ WorkSpace # [頁面2]
|__ index.js # 頁面具體業(yè)務(wù)代碼
|__ indes.less
|__models
|__ index.js # 導(dǎo)出封裝后的所有store旷偿，以及初始化saga
|__ request.js # 封裝網(wǎng)絡(luò)請求，比如所所有的方法進行攔截（inspector）
|__ model1 # [模塊1]store基于具體業(yè)務(wù)模塊來編寫爆侣，方便多頁面調(diào)用
|__ actionTypes.js
|__ actions.js
|__ reducer.js 封裝業(yè)務(wù)邏輯
|__ model2 # [模塊2]
|__services
|__model1.js 封裝接口請求
|__model2.js 封裝接口請求
|__common 公用的工具庫
|__chartUtil
|__arrayUtil
|__constants
編碼規(guī)范
加入ESLint萍程，讓工具幫我們約束代碼前后端接口規(guī)范
參考地址Git分支管理
master-作為主分支，存儲已發(fā)布版本的源碼兔仰，不能在此分支上進行開發(fā)茫负，只能合并release和hotfix分支。在master分支上構(gòu)建生產(chǎn)版本,發(fā)布完之后打包tag乎赴。
hotfix-熱修復(fù)分支忍法，用來修復(fù)線上緊急的bug,以線上版本對應(yīng)的主分支為基礎(chǔ)新建置吓。
test-預(yù)發(fā)布分支，也可以稱為提測分支缔赠，可以在此分支上修復(fù)bug衍锚，以develop分支為基礎(chǔ)新建或者合并develop分支。
dev-作為開發(fā)分支嗤堰，用于匯總各feature分支戴质，只能在此分支上進行合并，不能進行開發(fā)踢匣，這個分支一般上項目負責(zé)人使用告匠。
current feature-當前版本迭代功能的分支，業(yè)務(wù)人員均在feature分支上進行開發(fā)离唬。
future feature-未來版本迭代功能的分支后专，比如某個非常重要的功能需要在幾個版本之后開放，且開發(fā)耗時比較長输莺，所以需要提前投入開發(fā)戚哎。如果項目中沒有類似場景，可忽略此分支嫂用。Commit描述規(guī)范
<type>(<scope>): <subject>
<BLANK LINE>
<body>
<BLANK LINE>
<footer>
標題行: 必填, 描述主要修改類型和內(nèi)容
主題內(nèi)容: 描述為什么修改, 做了什么樣的修改, 以及開發(fā)的思路等等
頁腳注釋: 放 Breaking Changes 或 Closed Issues
分別由如下部分構(gòu)成:
type: commit 的類型
1.feat: 新特性
2.fix: 修改問題
3.refactor: 代碼重構(gòu)
4.docs: 文檔修改
5.style: 代碼格式修改, 注意不是 css 修改
6.test: 測試用例修改
7.chore: 其他修改, 比如構(gòu)建流程, 依賴管理.
scope: commit 影響的范圍, 比如: route, component, utils, build...
subject: commit 的概述
body: commit 具體修改內(nèi)容, 可以分為多行
footer: 一些備注, 通常是 BREAKING CHANGE 或修復(fù)的 bug 的鏈接.
- 定期CodeReview
定期CodReView型凳，可以保證代碼的質(zhì)量，并且發(fā)現(xiàn)一些測試人員不易發(fā)現(xiàn)的問題
四嘱函、自動化
前端工程化的很多臟活累活都應(yīng)該交給自動化工具來完成甘畅。
持續(xù)集成 將開發(fā)人員提交的代碼進行快速集成，并且實現(xiàn)自動化構(gòu)建和測試
持續(xù)交付 在持續(xù)集成的基礎(chǔ)上往弓，將集成并自動構(gòu)建疏唾、測試通過的代碼自動部署到測試或者仿真生產(chǎn)環(huán)境中。
持續(xù)部署 在持續(xù)交付的基礎(chǔ)上函似，進一步自動化槐脏，將部署生產(chǎn)環(huán)境的工作自動完成。
目前項目中使用gitlab搭配jenkins進行持續(xù)集成缴淋。
