在使用vue-cli开发SPA应用的时候,经常看到控制台会提示

Vue开发之devtools

说是下载Vue Devtools扩展以获得更好的开发体验,那么vue-devtools是什么呢?我们不妨点击他们给的GitHub地址,一看究竟。

https://github.com/vuejs/vue-devtools

Vue开发之devtools

这里我们看到已经获得将近3.7k star了,看来支持的人不少。

1.这里我们把它克隆到本地,或者直接下载

2.然后找到文件夹按住shift右击选择在此处打开命令行-Windows系统(Mac系统快速打开终端清参考https://jingyan.baidu.com/article/ce436649281a293773afd3d8.html

3.执行命令cnpm i (安装依赖)

4.执行命令 cnpm run build (讲下载下来的文件打包)

5.打开谷歌浏览器从右上角进入设置

Vue开发之devtools

这边选择开发者模式,然后选择加载已解压的扩展程序

Vue开发之devtools

然后选择文件夹里shell文件的chrome

Vue开发之devtools

好了,到此为止扩展程序devtools安装完毕!可以打开控制台体验一下,具体它有什么用,估计你用段时间就会觉得爽歪歪了。。。

Vue开发之devtools

相关文章:

  • 2022-12-23
  • 2021-09-07
  • 2022-01-19
  • 2021-12-12
  • 2022-01-20
  • 2021-10-26
猜你喜欢
  • 2021-09-29
  • 2022-02-09
  • 2021-11-16
相关资源
相似解决方案