在 Chrome 中以編譯方式安裝 vue-devtools
環(huán)境準(zhǔn)備
- Git 環(huán)境
- NodeJs 環(huán)境(版本 v14.17.0)
- 鏡像源設(shè)置
npm config set registry https://registry.npm.taobao.org npm config set disturl https://npm.taobao.org/dist npm config set electron_mirror https://npm.taobao.org/mirrors/electron/ npm config set sass_binary_site https://npm.taobao.org/mirrors/node-sass/ npm config set phantomjs_cdnurl https://npm.taobao.org/mirrors/phantomjs/ - 安裝 yarn
npm install yarn- 鏡像源設(shè)置
yarn config set registry https://registry.npm.taobao.org -g yarn config set disturl https://npm.taobao.org/dist -g yarn config set electron_mirror https://npm.taobao.org/mirrors/electron/ -g yarn config set sass_binary_site https://npm.taobao.org/mirrors/node-sass/ -g yarn config set phantomjs_cdnurl https://npm.taobao.org/mirrors/phantomjs/ -g - 安裝 TypeScript
yarn global add typescript
vue-devtools 編譯
編譯命令執(zhí)行環(huán)境： Git Bash 命令行窗口肤寝。原因是 Windows 下 cmd 命令窗口缺失 rm -rf 指令巴席，會(huì)在構(gòu)建過程中出錯(cuò)。
vue-devtools 版本：6.1.3刨裆。
- 從github 上下載 vue-devtools 項(xiàng)目源碼: 下載地址
- 切換到 vue-devtools 項(xiàng)目目錄
# 安裝依賴 yarn install # 構(gòu)建 yarn run build - 構(gòu)建結(jié)果
- img_2.png
Chrome 安裝插件
-
進(jìn)入谷歌瀏覽器“擴(kuò)展程序”設(shè)置红且，打開開發(fā)者模式盛险，選擇 shell-chrome 文件夾加載擴(kuò)展程序，如下圖：
- img_3.png
-
安裝成功
- img_4.png
