一個配置簡單卻功能強大的React Koa2同構isomorphic/universal項目模板

若是你還不是很瞭解什麼是同構,請先自行Google。javascript

如今市面上有不少優秀同構模板,可是其中有很多不能完美解決全部難題,只有其中一部分能夠,可是這一部分模板卻又集成了不少難懂的「黑科技」,熟悉週期較長,且難以擴展和維護。css

該模板解決了以下常見難題:java

  • 開發環境的代碼熱更新問題 - Browser端的熱替換(不刷新頁面)、Server端的熱更新(無需重啓node服務器)
  • 開發環境和生產環境儘可能保持環境一致 - 易於避免奇怪的bug
  • 開發和生產環境的代碼分割 - 按需加載、按路由加載腳本(javascript)和樣式(css)
  • 儘可能使用最新的官方組件 - 如react router v4,如今市面上不少樣板還都只能用v3實現
  • 完美結合koa和redux-thunk的async / await編程,實現真正的同構
  • checksum問題

配置簡單到讓你髮指:node

好吧,既然解決這麼多問題,是否是配置過程很噁心?答:不是的。整個項目的核心配置就在如下的2 * 2文件中:react

--- 開始 ---webpack

config/webpack.dev.config.js、src/development.js - 開發環境配置git

config/webpack.prod.config.js、src/production.js - 生產環境配置github

--- 結束 ---web

就這樣簡單... 這樣,大大方便使用者快速理解和自定義擴展。編程

若是你不相信:詳細信息、項目代碼請直戳Github倉庫地址 - Koa-React-Universal

代碼目前仍處於迭代階段(有些額外功能還需補充上),可是開發環境和生產環境已經配置完畢。截圖後面完成後再補上。

若是以爲好用,請送上star,請盡情fork。

相關文章
相關標籤/搜索