通過(guò)實(shí)例解析chrome如何在mac環(huán)境中安裝vue-devtools插件
1之前在windows上裝過(guò)，最近剛換了個(gè)mac本，重新安裝下，也是為了記錄下我安裝的過(guò)程。
github下載vue-devtool到本地
下載地址https://github.com/vuejs/vue-devtools#vue-devtools
注意，下載的時(shí)候默認(rèn)的是在dev分支，要切換到master,然后克隆到本地（可以先放桌面）
2.將下載的項(xiàng)目文件放入 Chrome瀏覽器的插件文件夾
在瀏覽器地址欄輸入chrome://version/
找到路徑之后，可以在頂部工具欄”前往“中直接輸入文件地址
3.在default文件夾下新建Extensions文件夾(已經(jīng)存在就不用新建了)，并且將下載的vue-devtool-master文件夾復(fù)制進(jìn)去，cd進(jìn)入該文件夾cd vue-devtools-master
4. 安裝依賴
npm install
npm run build（沒(méi)有這一步會(huì)報(bào)錯(cuò)哦～）
5.在地址欄輸入chrome://extensions,打開(kāi)右側(cè)開(kāi)發(fā)者模式
將vue-devtools-master/shells/chrome文件夾拖入擴(kuò)展程序頁(yè)面即可
如果以上步驟完成之后，在控制臺(tái)還是不顯示Vue的tab，以上vue圖標(biāo)不亮，點(diǎn)擊圖標(biāo)出現(xiàn)vue.js not detected的提示還需要進(jìn)行以下步驟
找到安裝目錄
修改mainifest.json文件中的persistent：false，修改成persistent：true。一般這個(gè)時(shí)候就可以正常使用了
如果還是不行，修改webpack.config.js的代碼
修改成development，（可能正式版本發(fā)布的時(shí)候，需要修改回來(lái)，待驗(yàn)證）
再運(yùn)行vue項(xiàng)目 就可以正常調(diào)試了
以上就是本文的全部?jī)?nèi)容，希望對(duì)大家的學(xué)習(xí)有所幫助，也希望大家多多支持腳本之家。
相關(guān)文章
Vue輸入框狀態(tài)切換&自動(dòng)獲取輸入框焦點(diǎn)的實(shí)現(xiàn)方法
這篇文章主要介紹了Vue輸入框狀態(tài)切換&自動(dòng)獲取輸入框焦點(diǎn)的實(shí)現(xiàn),本文通過(guò)實(shí)例代碼給大家介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值，需要的朋友可以參考下2023-05-05
本文主要介紹了在vue3中使用jsx的配置以及一些小問(wèn)題，文中通過(guò)示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2022-03-03
這篇文章主要為大家詳細(xì)介紹了vue-cli之router基本使用方法，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2017-10-10
這篇文章主要介紹了vue中引入路徑@的用法及說(shuō)明，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。如有錯(cuò)誤或未考慮完全的地方，望不吝賜教2022-09-09
element表單驗(yàn)證如何清除校驗(yàn)提示語(yǔ)
本文主要介紹了element表單驗(yàn)證如何清除校驗(yàn)提示語(yǔ)，文中通過(guò)示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2021-10-10
本文主要介紹了Vue.js中el-table表格自定義列控制與拖拽，文中通過(guò)示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來(lái)一起學(xué)習(xí)學(xué)習(xí)吧2023-05-05
el-select自定義指令實(shí)現(xiàn)觸底加載分頁(yè)請(qǐng)求options數(shù)據(jù)(完整代碼和接口可直接用)
某些情況下,下拉框需要做觸底加載,發(fā)請(qǐng)求,獲取option的數(shù)據(jù),下面給大家分享el-select自定義指令實(shí)現(xiàn)觸底加載分頁(yè)請(qǐng)求options數(shù)據(jù)(附上完整代碼和接口可直接用),感興趣的朋友參考下吧2024-02-02
Vue項(xiàng)目中CSS?Modules和Scoped?CSS的介紹與區(qū)別
在vue中我們有兩種方式可以定義css作用域,一種是scoped,另一種就是css modules,下面這篇文章主要給大家介紹了關(guān)于Vue項(xiàng)目中CSS?Modules和Scoped?CSS的相關(guān)資料,需要的朋友可以參考下2022-03-03
Vue.js中數(shù)組變動(dòng)的檢測(cè)詳解
這篇文章給大家主要介紹了Vue.js中數(shù)組變動(dòng)的檢測(cè)，文中給出了詳細(xì)的示例代碼和過(guò)程介紹，相信會(huì)對(duì)大家的理解和學(xué)習(xí)很有幫助，有需要的朋友們下面來(lái)一起看看吧。2016-10-10
給大家?guī)?lái)一篇關(guān)于用nodejs實(shí)現(xiàn)excel文件的讀取并去重的功能，有興趣的朋友參考學(xué)習(xí)下。2018-04-04