首先我們要下載react-dev工具的壓縮包检诗,打開https://github.com/facebook/react-devtools?
示例圖
下載完成后瓢剿,我們解壓進(jìn)入這個(gè)文件夾里面,打開git或者cmd運(yùn)行攻泼。
npm --registry https://registry.npm.taobao.org install鉴象,來(lái)安裝依賴。淘寶鏡像安裝速度比較快纺弊,然后會(huì)出現(xiàn)
之前的警告和錯(cuò)誤沒(méi)有關(guān)系,出現(xiàn)這個(gè)就是安裝成功了傍睹。
然后我們要把這個(gè)程序拓展到chrome瀏覽器上犹菱,繼續(xù)運(yùn)行 npm run build:extension:chrome
出現(xiàn)這個(gè)時(shí)候就說(shuō)明安裝成功。
運(yùn)行之后會(huì)生成一個(gè)文件夾:react-devtools -> shells -> chrome -> build -> unpacked文件夾
這個(gè)時(shí)候可以按照上面提示進(jìn)行運(yùn)行yarn/npm? run test:chrome ,運(yùn)行之后會(huì)彈出谷歌瀏覽器安裝之后的版本访得。
右上角出現(xiàn)react的logo和控制臺(tái)出現(xiàn)react的標(biāo)識(shí)后陕凹,就是成功了鳄炉。
或者打開谷歌的擴(kuò)展程序传趾,添加剛剛新增的文件夾為拓展程序泥技,添加之后,運(yùn)行項(xiàng)目珊豹,就可以看到
不是react項(xiàng)目的話店茶,右上角的logo是灰色的蜕便。
這樣就OK了贩幻。