欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

Vue3?vue-devtools?調(diào)試工具下載安裝使用教程

 更新時間:2022年08月12日 14:41:47   作者:NiKlaus729  
vue-devtools是一款基于chrome游覽器的插件,用于調(diào)試vue應(yīng)用,這可以極大地提高我們的調(diào)試效率,尤其是對于初學(xué)vue的朋友來說可謂是一大利器,這篇文章主要介紹了Vue3?vue-devtools?調(diào)試工具下載安裝,需要的朋友可以參考下

官網(wǎng)下載地址:GitHub - vuejs/devtools: ?? Browser devtools extension for debugging Vue.js applications.

完成后解壓到目錄,解壓后目錄如下:

終端命令行進(jìn)入到解壓后的Vue-Devtools目錄:

執(zhí)行命令下載yarn:

npm install -g yarn

安裝好yarn后,通過yarn來安裝相關(guān)依賴:

yarn install

依賴安裝完成后,開始打包build。
需要注意,這里的命令需要帶watch,如果不帶,會出錯:

yarn run build:watch

代碼執(zhí)行一陣后,沒有其他反應(yīng),此時Ctrl+C退出即可。
接下來執(zhí)行dev:

yarn run dev:chrome

出現(xiàn)下面的界面后就可以Ctrl+C退出終端了:

此時,Vue-Devtools目錄下,生成了build目錄:

安裝

1、打開Chrome瀏覽器擴(kuò)展程序

2、加載已解壓的程序

3、擴(kuò)展欄固定vue-devtools程序

至此,Vue-Devtools插件安裝完成,打開使用vue3的網(wǎng)站,F(xiàn)12打開Chrome調(diào)試臺,可以看到Vue-Devtools的界面按鈕:

到此這篇關(guān)于Vue3vue-devtools調(diào)試工具下載安裝的文章就介紹到這了,更多相關(guān)vue-devtools調(diào)試工具內(nèi)容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家!

相關(guān)文章

  • 詳解Vue This$Store總結(jié)

    詳解Vue This$Store總結(jié)

    這篇文章主要介紹了詳解Vue This$Store總結(jié),小編覺得挺不錯的,現(xiàn)在分享給大家,也給大家做個參考。一起跟隨小編過來看看吧
    2018-12-12
  • 談?wù)剬ue?Router的理解

    談?wù)剬ue?Router的理解

    vue-router是Vue.js官方的路由插件,它和vue.js是深度集成的,適合用于構(gòu)建單頁面應(yīng)用,這篇文章主要介紹了對Vue?Router的理解,需要的朋友可以參考下
    2022-11-11
  • Vue?2中實(shí)現(xiàn)CustomRef方式防抖節(jié)流

    Vue?2中實(shí)現(xiàn)CustomRef方式防抖節(jié)流

    這篇文章主要為大家介紹了Vue?2中實(shí)現(xiàn)CustomRef方式防抖節(jié)流示例詳解,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進(jìn)步,早日升職加薪
    2023-02-02
  • Vue extends 屬性的用法示例詳解

    Vue extends 屬性的用法示例詳解

    這篇文章主要為大家介紹了Vue extends 屬性的用法示例詳解,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進(jìn)步,早日升職加薪
    2022-08-08
  • Vue基于iview table展示圖片實(shí)現(xiàn)點(diǎn)擊放大

    Vue基于iview table展示圖片實(shí)現(xiàn)點(diǎn)擊放大

    這篇文章主要介紹了Vue基于iview table展示圖片實(shí)現(xiàn)點(diǎn)擊放大,文中通過示例代碼介紹的非常詳細(xì),對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值,需要的朋友可以參考下
    2020-08-08
  • vue前端HbuliderEslint實(shí)時校驗(yàn)自動修復(fù)設(shè)置

    vue前端HbuliderEslint實(shí)時校驗(yàn)自動修復(fù)設(shè)置

    這篇文章主要為大家介紹了vue前端中Hbulider中Eslint實(shí)時校驗(yàn)自動修復(fù)設(shè)置操作過程,有需要的朋友可以借鑒參考下希望能夠有所幫助
    2021-10-10
  • 一篇文章帶你使用Typescript封裝一個Vue組件(簡單易懂)

    一篇文章帶你使用Typescript封裝一個Vue組件(簡單易懂)

    這篇文章主要介紹了使用Typescript封裝一個Vue組件,文中通過示例代碼介紹的非常詳細(xì),對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值,需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧
    2020-06-06
  • vue彈窗組件使用方法

    vue彈窗組件使用方法

    彈窗是一個項(xiàng)目必備的復(fù)用利器,這篇文章主要介紹了vue彈窗組件的使用方法,具有一定的參考價值,感興趣的小伙伴們可以參考一下
    2018-04-04
  • 一篇文章教會你部署vue項(xiàng)目到docker

    一篇文章教會你部署vue項(xiàng)目到docker

    在前端開發(fā)中,部署項(xiàng)目是我們經(jīng)常發(fā)生的事情,下面這篇文章主要給大家介紹了關(guān)于部署vue項(xiàng)目到docker的相關(guān)資料,文中通過示例代碼介紹的非常詳細(xì),需要的朋友可以參考下
    2022-04-04
  • Vue 父子組件、組件間通信

    Vue 父子組件、組件間通信

    本篇文章主要介紹了Vue 父子組件、組件間通信示例,小編覺得挺不錯的,現(xiàn)在分享給大家,也給大家做個參考。一起跟隨小編過來看看吧
    2017-03-03

最新評論