vue.js devtools(chrome調(diào)試工具)

Vue devtools插件主要運(yùn)用于谷歌瀏覽器的開(kāi)發(fā)者調(diào)試階段，對(duì)于廣大開(kāi)發(fā)人員來(lái)說(shuō)，它能夠?yàn)槠涮峁┒鄠€(gè)網(wǎng)頁(yè)結(jié)構(gòu)解析和調(diào)試工具，側(cè)邊欄窗口代碼優(yōu)化調(diào)試，新增一個(gè)性能選擇卡，多項(xiàng)優(yōu)化下讓您可以有效提高整天調(diào)試效率。插件功能多，安全穩(wěn)定，值得推薦。

Vue.js devtools簡(jiǎn)介

用于調(diào)試Vue.js應(yīng)用程序的Chrome和Firefox DevTools擴(kuò)展。Chrome devtools擴(kuò)展用于調(diào)試Vue.js應(yīng)用程序。

插件特色

1、性能

與路由選項(xiàng)卡一樣，性能選項(xiàng)卡也是一個(gè)新增功能。此選項(xiàng)卡由兩部分組成，“每秒幀數(shù)”和“組件渲染”。

第一個(gè)選項(xiàng)卡“每秒幀數(shù)”顯示一個(gè)實(shí)時(shí)源圖表，其中包含應(yīng)用程序的當(dāng)前fps。這可用于查找減慢應(yīng)用程序速度的某些操作或組件。

2、設(shè)置

將顯示密度更改為更緊湊的布局

規(guī)范化組件名稱(chēng)（my-component將變?yōu)镸yComponent）

更新主題 - 打開(kāi)或關(guān)閉新的黑暗主題選項(xiàng)

3、路由

Routing選項(xiàng)卡是devtools套件的全新選項(xiàng)。這里有兩個(gè)不同的視圖，“歷史記錄”和“路徑”，可以通過(guò)單擊“路由”選項(xiàng)卡標(biāo)題進(jìn)行交換。

軟件亮點(diǎn)

1、上手簡(jiǎn)單

在用戶(hù)已經(jīng)了解HTML，CSS和javaScript的情況下，閱讀指南后即可立即開(kāi)始構(gòu)建。

2、功能多樣

漸進(jìn)式的生態(tài)系統(tǒng)，在圖書(shū)館和功能全面的框架之間進(jìn)行擴(kuò)展。

3、演示優(yōu)化

20KB min+gzip運(yùn)行，快速虛擬DOM，最少的優(yōu)化工作。

Vue.js devtools插件還可以看到它們最后的更新時(shí)間，如果它們有自己的主頁(yè)，還可以對(duì)它們進(jìn)行分類(lèi)和其他更多的功能。

使用攻略

1、下載安裝文件

下載插件，并在瀏覽器安全提示時(shí)選擇【保留】，在下載文件夾中找到下載好的文件，后綴是.crx 。

說(shuō)明：若出現(xiàn)安全提示，請(qǐng)選擇保留。這是瀏覽器的默認(rèn)設(shè)置，我們的插件不會(huì)危害你的計(jì)算機(jī)。

2、 打開(kāi)擴(kuò)展程序安裝頁(yè)面

復(fù)制chrome://extensions并粘貼到地址欄，按回車(chē)鍵進(jìn)入擴(kuò)展程序安裝頁(yè)面，打開(kāi)右上角的【開(kāi)發(fā)者模式】。

3、 安裝插件

將下載好的.crx文件拖拽到到擴(kuò)展安裝頁(yè)面內(nèi)，等待數(shù)秒，在安裝彈窗內(nèi)點(diǎn)擊添加即可。

注意問(wèn)題

如果頁(yè)面使用的是Vue.js的生產(chǎn)/精簡(jiǎn)版本，則默認(rèn)情況下禁用devtools檢查，因此不會(huì)顯示Vue窗格。

要使其適用于通過(guò)file：//協(xié)議打開(kāi)的頁(yè)面，您需要在Chrome的擴(kuò)展程序管理面板中選中此擴(kuò)展程序的“允許訪問(wèn)文件URL”。

僅當(dāng)您希望自己從源代碼構(gòu)建擴(kuò)展以獲取尚未發(fā)布的功能時(shí)，才需要這樣做。

• 奧維互動(dòng)地圖電腦版
• similar sites(發(fā)現(xiàn)類(lèi)似網(wǎng)站插件)
• adobe flash player官方版
• 阿呆喵廣告攔截
• 谷歌衛(wèi)星地圖高清最新版
• internet explorer 6.0版本瀏覽器