Taro3之前欢摄，在小程序開發(fā)者工具的
AppData面板看到的都是Taro虛擬DOM的序列化結(jié)果了赌，而不是頁面的data數(shù)據(jù)葛峻，嚴(yán)重影響開發(fā)效率两波。Taro3對(duì)React DevTools和Vue DevTools進(jìn)行了適配，只需要簡(jiǎn)單地配置击儡，就能夠和開發(fā)Web應(yīng)用時(shí)一樣使用框架的DevTools塔沃。
一、誤解點(diǎn)
首先要清楚的是曙痘，小程序開發(fā)者工具和dev-tools完全是兩個(gè)不同的工具芳悲，安裝React DevTools插件后，效果可不是直接嵌入到小程序開發(fā)者工具的調(diào)試器下的一個(gè)工具屬性边坤。而是獨(dú)立彈窗打開的一個(gè)調(diào)試App（基于electron開發(fā)）名扛。
其次，官方文檔就是誤導(dǎo)人茧痒，如下：
正確來說肮韧，應(yīng)該全局安裝react-devtools和項(xiàng)目對(duì)應(yīng)的react-devtools插件包，官方文檔中react-devtools這個(gè)步驟直接跳過了，react-devtools都沒安裝弄企，插件包又怎么會(huì)生效呢超燃。而且這個(gè)包npm安裝不上，cnpm又找不到資源拘领，yarn沒有試過意乓，因此這里選擇使用taro-plugin-react-devtools這個(gè)插件庫。
二约素、安裝
// 建議用cnpm安裝届良，兩個(gè)都可以正常安裝
# npm i taro-plugin-react-devtools --save-dev
# npm i react-devtools -g
三、開發(fā)環(huán)境下配置Taro插件
// config/dev.js
const config = {
// ...
plugins: ['taro-plugin-react-devtools'],
// ...
}
四圣猎、啟動(dòng)react-devtools工具
react-devtools
五士葫、引入react-devtools工具生成的服務(wù)地址
啟動(dòng)react-devtools工具后， App里面會(huì)生成一個(gè)本地服務(wù)地址送悔，復(fù)制粘貼引入到taro項(xiàng)目中的index.html慢显。如：
<script src="http://localhost:8097"></script>
六、運(yùn)行項(xiàng)目
npm run dev:weapp
七欠啤、效果
