!
也想出现在这里? 联系我们
广告位
当前位置:首页>技术分享>网站运维>浏览器插件 vue-devtools 安装笔记

浏览器插件 vue-devtools 安装笔记

这两天在学习 Vue ,需要安装下 vue-devtools 插件方便调试查看问题。这里简单记录下安装过程及遇到的问题。

首先,安装 vue-devtools 之前需要先下载插件,插件下载地址>>> https://github.com/vuejs/vue-devtools

浏览器插件 vue-devtools 安装笔记

注意不要直接 Clone or download ,这样下载的是开发版本,安装的时候可能会报错:

浏览器插件 vue-devtools 安装笔记

选择 release 查看发布版本,往前跳几个版本安装比较好,稳定。

下载完成后解压,在解压文件夹下按住 Shift 键,然后右键弹出如下面板。

浏览器插件 vue-devtools 安装笔记

选择“在此处打开 Powersheell窗口(S)”,打开命令工具,运行 npm install 安装依赖。

浏览器插件 vue-devtools 安装笔记

安装完成后运行npm run build 编译一下。

浏览器插件 vue-devtools 安装笔记

编译成功后,打开安装文件夹下的 shells\\chrome 文件夹,找到 mainifest.json 文件。

浏览器插件 vue-devtools 安装笔记

修改 persistent 为 true。persistent 为 true 时,在background字段中指出的js脚本将持续运行在后台; persistent 为 false ,则这些脚本将只在事件活动时运行,事件不活动时就会释放其占有的内存等资源。

浏览器插件 vue-devtools 安装笔记

然后打开浏览器,Chrome 下为“设置/更多工具/扩展程序”下,如果没能找到相应拓展,打开开发者工具,点击“加载已解压的扩展程序”,选择安装文件夹下的 chrome 文件夹即可。

浏览器插件 vue-devtools 安装笔记

最后需要注意的是,该插件会在使用 Vue 开发的网站上点亮图标,并且在开发时控制台显示调试选项。

浏览器插件 vue-devtools 安装笔记

给TA打赏
共{{data.count}}人
人已打赏
网站运维

宝塔面板WordPress使用自定义404页面不生效怎么回事

2022-9-4 11:51:59

网站运维

WordPress 纯代码实现 SMTP 收发邮件

2022-9-4 12:31:16

声明 本站上的部份代码及教程来源于互联网,仅供网友学习交流,若您喜欢本文可附上原文链接随意转载。无意侵害您的权益,请发送邮件至 admin@s9h.cn 或点击右侧 私信:少羽 反馈,我们将尽快处理。
0 条回复A文章作者M管理员
    暂无讨论,说说你的看法吧
个人中心
购物车
优惠劵
今日签到
有新私信 私信列表
搜索