不必翻墙,安装vue浏览器插件

Google chrome 浏览器开发vue项目时,需要安装vue浏览器插件。
Vue.js devtools可以方便查看vue组件,events, 路由,vuex等信息。



这是未安装时的warning

devtool-warning.png




这是浏览器扩展程序中的插件

extensions.png


步骤如下:

1. 进入warning中提示的github仓库

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

devtool-git.png

可以下载zip包,也可以clone仓库。这里我下载的压缩包。

2. 解压后,在终端进入文件夹路径。

Tips 解压后的文件夹名称一定要与package.json中的name一致。否则build报错。

这里下载下来的文件夹名称是devtools-main,手动改成vue-devtools

执行:
cnpm install

结束后,再执行:
cnpm run build

最后在浏览器扩展程序中,加载已解压的扩展程序

选中vue-devtools/packages/shell-chrome

添加成功!

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容