React seed構(gòu)建過程
寫在前面
Facebook發(fā)布react之后，一直想找機(jī)會(huì)學(xué)一下,從官網(wǎng)到博客到問答，積累了點(diǎn)零散的知識(shí),在github找了很多學(xué)習(xí)react的工程,不是項(xiàng)目太大就是配置太多,于是最近參考了vue-cli以及github上的一些開源項(xiàng)目,根據(jù)自己的喜好，包括目錄結(jié)構(gòu),命名,文件存放,弄了一個(gè)react-starter
地址:
https://github.com/guoxiangwen/react-starter
目錄結(jié)構(gòu)
集成的東西
webpack2,react-router,less,nightwatch,jest,babel,沒有集成redux因?yàn)椴皇撬许?xiàng)目都會(huì)用到它,如果你的項(xiàng)目要用，自行npm i就行了
開發(fā)環(huán)境
開發(fā)環(huán)境下還是用的webpack-dev-server,并沒有自己像vue-cli那樣自己根據(jù)express來配置.這樣已經(jīng)夠用了，而react官網(wǎng)的create-react-app是把所有配置都封裝在了react-scripts中.對(duì)開發(fā)者來說不是很透明,也不知道發(fā)生了什么.
npm start
生產(chǎn)環(huán)境
生產(chǎn)環(huán)境大家可以自己跑一個(gè)靜態(tài)server，例如:
http-server,anywhere，用來訪問build文件夾,項(xiàng)目的根目錄中還準(zhǔn)備了一個(gè)nginx.conf。用來配置nginx.大家只需要修改location的root就行了npm run build
location / {
root G:\\workspace\\github\\react-starter\\build;
index index.html index.htm;
try_files $uri $uri/ /index.html =404; #客戶端開啟html5mode
}
測(cè)試
unit測(cè)試
這里用的是react官網(wǎng)推薦的jest
npm run unit
e2e測(cè)試
雖然平時(shí)寫e2e寫得少，不過這里還是用到了nightwatch。
npm run e2e
最后
大家如果有什么建議可以到issue里面提.
