零配置部署React
你想使用 React 來(lái)構(gòu)建應(yīng)用嗎?“入門(mén)”是很容易的,可是接下來(lái)呢?
React 是一個(gè)構(gòu)建用戶(hù)界面的庫(kù),而它只是組成一個(gè)應(yīng)用的一部分。應(yīng)用還有其他的部分——風(fēng)格、路由器、npm 模塊、ES6 代碼、捆綁和更多——這就是為什么使用它們的開(kāi)發(fā)者不斷流失的原因。這被稱(chēng)為 JavaScript 疲勞。盡管存在這種復(fù)雜性,但是使用 React 的用戶(hù)依舊繼續(xù)增長(zhǎng)。
社區(qū)應(yīng)對(duì)這一挑戰(zhàn)的方法是共享模版文件。這些模版文件展示出開(kāi)發(fā)者們架構(gòu)選擇的多樣性。官方的“開(kāi)始入門(mén)”似乎離一個(gè)實(shí)際可用的應(yīng)用程序相去甚遠(yuǎn)。
新的,零配置體驗(yàn)
受開(kāi)發(fā)者來(lái)自 Ember.js 和 Elm 的經(jīng)驗(yàn)啟發(fā),F(xiàn)acebook 的人們想要提供一個(gè)簡(jiǎn)單、直接的方式。他們發(fā)明了一個(gè)新的開(kāi)發(fā) React 應(yīng)用的方法 :create-react-app。在初始的公開(kāi)版發(fā)布的三個(gè)星期以來(lái),它已經(jīng)受到了極大的社區(qū)關(guān)注(超過(guò) 8000 個(gè) GitHub 粉絲)和支持(許多的拉取請(qǐng)求)。
create-react-app 是不同于許多過(guò)去使用模板和開(kāi)發(fā)啟動(dòng)工具包的嘗試。它的目標(biāo)是零配置的慣例-優(yōu)于-配置,使開(kāi)發(fā)者關(guān)注于他們的應(yīng)用的不同之處。
零配置一個(gè)強(qiáng)大的附帶影響是這個(gè)工具可以在后臺(tái)逐步成型。零配置奠定了工具生態(tài)系統(tǒng)的基礎(chǔ),創(chuàng)造的自動(dòng)化和喜悅的開(kāi)發(fā)遠(yuǎn)遠(yuǎn)超越 React 本身。
將零配置部署到 Heroku 上
多虧了 create-react-app 中打下的零配置基礎(chǔ),零配置的目標(biāo)看起來(lái)快要達(dá)到了。因?yàn)檫@些新的應(yīng)用都使用一個(gè)公共的、默認(rèn)的架構(gòu),構(gòu)建的過(guò)程可以被自動(dòng)化,同時(shí)可以使用智能的默認(rèn)項(xiàng)來(lái)配置。因此,我們創(chuàng)造這個(gè)社區(qū)構(gòu)建包來(lái)體驗(yàn)在 Heroku 零配置的過(guò)程。
在兩分鐘內(nèi)創(chuàng)造和發(fā)布 React 應(yīng)用
你可以免費(fèi)在 Heroku 上開(kāi)始構(gòu)建 React 應(yīng)用。
- npm install -g create-react-app
- create-react-app my-app
- cd my-app
- git init
- heroku create -b https://github.com/mars/create-react-app-buildpack.git
- git add .
- git commit -m "react-create-app on Heroku"
- git push heroku master
- heroku open
使用構(gòu)建包文檔親自試試吧。
從零配置出發(fā)
create-react-app 非常的新(目前版本是 0.2),同時(shí)因?yàn)樗哪繕?biāo)是簡(jiǎn)潔的開(kāi)發(fā)者體驗(yàn),更多高級(jí)的使用情景并不支持(或者肯定不會(huì)支持)。例如,它不支持服務(wù)端渲染或者自定義捆綁。
為了支持更好的控制,create-react-app 包括了 npm run eject 命令。Eject 將所有的工具(配置文件和 package.json 依賴(lài)庫(kù))解壓到應(yīng)用所在的路徑,因此你可以按照你心中的想法定做。一旦被彈出,你做的改變或許有必要選擇一個(gè)特定的用 Node.js 或靜態(tài)的構(gòu)建包來(lái)布署。總是通過(guò)一個(gè)分支/拉取請(qǐng)求來(lái)使類(lèi)似的工程改變生效,因此這些改變可以輕易撤銷(xiāo)。Heroku 的預(yù)覽應(yīng)用對(duì)測(cè)試發(fā)布的改變是***的。
我們將會(huì)追蹤 create-react-app 的進(jìn)度,當(dāng)它們可用時(shí),同時(shí)適配構(gòu)建包來(lái)支持更多的高級(jí)使用情況。發(fā)布萬(wàn)歲!