怎麼安裝Vue Devtools調試工具插件?

Vue DevtoolsVue官方推出的瀏覽器插件,能夠算是Vue開發調試神器,它能夠讓你可以在瀏覽器實時的編輯數據並當即看到其反映出來的變化,讓你告別console大法。很是好用,誰用誰知道,Vue開發必備,強烈推薦!vue

由於衆所周知的緣由,Google Chrome商店沒法正常訪問,因此本文提供另外一種谷歌插件安裝的方式。git

1.下載Vue Devtools插件,請到GitHub倉庫:https://github.com/Jackyyans/code123下載,路徑:/normal/libs/Vue.js Devtools_5.3.3.crxgithub

2.谷歌瀏覽器地址欄輸入:chrome://extensions,點擊右邊的按鈕,打開開發者模式 3.將Vue.js Devtools_5.3.3.crx拖動到谷歌瀏覽器,安裝。 4.點擊添加擴展程序,就能夠看到多了個Vue Devtools的圖標,安裝成功。 5.打開Vue的項目,能夠看到圖標變亮,多了個vue面板,顯示了當前頁面用到的vue組件,點擊組件,右邊會展現當前組件的datacomputed等數據,能夠直接更改或刪除數據進行調試。另外,也能夠比較直觀的看到VuexVue Router等信息。 6.React也有相似的瀏覽器插件React Developer Tools,安裝方法跟Vue Devtools同樣的,請到GitHub倉庫:https://github.com/Jackyyans/code123下載,路徑:/normal/libs/React Developer Tools_4.7.0.crxweb

相關文章
相關標籤/搜索