React安裝React Devtools除錯工具

2022-05-03 23:21:20 字數 1337 閱讀 4356

在執行乙個react專案的時候瀏覽器控制台會提醒你去安裝react devtools除錯工具。

download the react devtools for a better development experience:

看到瀏覽器控制台這種說明,很是不舒服,於是就安裝了react devtools瀏覽器擴充套件外掛程式。

此鏈結打不開,應該需要fq。

2.進入到react-devtools資料夾,用npm安裝依賴。

..............................華麗的省略號................................

npm notice created a lockfile as package-lock.json. you should commit this file.

npm warn [email protected] requires a peer of ajv@>=5.0.0 but none is installed. you must install peer dependencies yourself.

npm warn [email protected] requires a peer of acorn@^6.0.0 but none is installed. you must install peer dependencies yourself.

added 1833 packages from 819 contributors in 38.076s   //success

3.安裝依賴成功後,打包程式擴充套件;npm run build:extension:chrome

出現這個就說明安裝成功了。

並且會在你的專案中生成乙個新的資料夾:react-project⁩ ▸ ⁨react⁩ ▸ ⁨react-devtools⁩ ▸ ⁨shells⁩ ▸ ⁨chrome⁩ ▸ ⁨build⁩

4.開啟chrome擴充套件程式chrome://extensions/,載入已解壓的擴充套件程式,選擇第三部生成的unpacked資料夾。這時就會新增乙個新的擴充套件程式react-devtools,並在你的瀏覽器右上角會有乙個react標誌,代表安裝成功。

React學習 一 安裝React環境

建議碼友們一定要看react官方文件哦!1.node.js安裝 如果沒有安裝的小夥伴,看這裡node安裝教程 安裝之後一定要檢驗一下版本號是否出來了 2.安裝 簡單說一下 npx 的作用如 1.預設情況下,首先檢查路徑中是否存在要執行的包 即在專案中 2.如果存在,它將執行 3.若不存在,意味著尚未...

React 安裝 webpack打包

你也可以直接使用菜鳥教程的 react cdn 庫,位址如下 以下例項輸出了 hello,world id example 嘗試一下 例項解析 例項中我們引入了三個庫 react.min.js react dom.min.js 和 browser.min.js reactdom render hel...

React 安裝與搭建

1.安裝node.js 安裝完成之後在cmd中輸入node v和npm v檢視是否安裝成功 3.建立react專案 建立專案的過程需要花費幾分鐘 安裝完成之後上面也會提示我們如何開始執行專案 4.按照上面的提示進入到專案,然後啟動 c users wyhui cd wyh react test c ...