安裝

安裝React 需要在計(jì)算機(jī)上安裝 Node.js >= 6 和 npm >= 5.2。

Node.js 文集

在Windows上安裝React

通過(guò)npm 使用 React

國(guó)內(nèi)使用 npm 速度很慢，可以使用淘寶定制的 cnpm (gzip 壓縮支持) 命令行工具代替默認(rèn)的 npm:

npm install -g cnpm --registry=https://registry.npm.taobao.org

npm config set registry https://registry.npm.taobao.org

安裝 cnpm 圖示

使用 create-react-app 快速構(gòu)建 React 開(kāi)發(fā)環(huán)境

create-react-app 是來(lái)自于 Facebook，通過(guò)該命令我們無(wú)需配置就能快速構(gòu)建 React 開(kāi)發(fā)環(huán)境。

create-react-app 自動(dòng)創(chuàng)建的項(xiàng)目是基于 Webpack + ES6 。

全局安裝：

cnpm install -g create-react-app

安裝?create-react-app? 圖示

構(gòu)建項(xiàng)目

create-react-app my-app

cd my-app

npm start

創(chuàng)建React 項(xiàng)目圖示

根據(jù)提示進(jìn)入 my-app 文件，運(yùn)行項(xiàng)目。

項(xiàng)目運(yùn)行圖示

瀏覽器會(huì)自動(dòng)運(yùn)行該網(wǎng)頁(yè)（我的是自動(dòng)運(yùn)行），如果沒(méi)有運(yùn)行，我們根據(jù)提示在瀏覽器中輸入提示的地址：

http://localhost:3000/?

或

http://192.168.0.173:3000/

瀏覽器運(yùn)行結(jié)果：

瀏覽器運(yùn)行結(jié)果圖示

項(xiàng)目目錄結(jié)構(gòu)：

項(xiàng)目目錄結(jié)構(gòu)圖示

manifest.json 指定了開(kāi)始頁(yè)面 index.html，一切的開(kāi)始都從這里開(kāi)始，所以這個(gè)是代碼執(zhí)行的源頭。

我們可以打開(kāi) src 文件夾內(nèi)的 App.js 對(duì)頁(yè)面進(jìn)行修改：（添加 Hello World）

對(duì) App.js 進(jìn)行修改

修改后，打開(kāi)頁(yè)面 （頁(yè)面會(huì)自動(dòng)更新）：

修改后的頁(yè)面

React 可以直接下載使用，用<script>標(biāo)簽添加到HTML頁(yè)面中，可以在官網(wǎng)?https://reactjs.org/?下載最新版。