我開始安裝react-devtools的時候 百度了一波，都是寫的不清不楚，官網(wǎng)又都是英文的 也不是完全理解，經(jīng)過一番折騰出來以后，寫個文檔記錄一下，也可避免新手首次安裝走彎路
我安裝react-devtools的前提是本地安裝了git 以及node 我相信準備學(xué)react的同學(xué)，應(yīng)該都有了解使用

1.首先打開官網(wǎng)：https://github.com/facebook/react-devtools

1.png

2.本地打開git bash 然后復(fù)制上面的github下載鏈接
在git中輸入：
git clone https://github.com/facebook/react-devtools.git
3.克隆完成以后
cd react-devtools //切換到工程目錄
cnpm i //安裝依賴
4.安裝完成以后切換目錄
cd shells/chrome //切換到chrome目錄下
5.然后運行node build.js 當前目錄下會生成build目錄 這個build目錄下的unpacked目錄就是chrome中所需react-devtools的工具擴展程序包

到這里有兩種方式在chrome瀏覽器中安裝react-devtools
方法一：6.1 接著上面的第五步 在git中將目錄切換到react-devtools目錄下：
運行命令npm run test:chrome
此時會自動安裝react-devtools 并打開chrome瀏覽器

2.png

此時在瀏覽器右上角的工具欄里打開->更多工具->擴展程序里就可以看到我們安裝成功了

3.png

方法二：6.2:打開chrome瀏覽器 如6.1打開擴展程序
進行如下操作：

4.png

打開開發(fā)者模式按鈕 選擇‘’加載已解壓擴展程序‘’選擇react-detools目錄下的shells->chrome中build目錄中的unpacked即可

到此 react-devtools安裝成功