Vscode——调试数据可视化插件debug-visualizer

最新推荐文章于 2024-03-20 09:42:36 发布
最新推荐文章于 2024-03-20 09:42:36 发布
阅读量2.8k 收藏 5
点赞数 2
分类专栏： 编程软件 文章标签： 信息可视化 vscode ide
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/Williamcsj/article/details/129125094
版权

debug-visualizer是一款极其优秀的调试数据可视化插件

安装方法

  1. 第一步：vscode插件库安装 debug-visualizer
  2. 第二步：环境内输入 pip install vscodedebugvisualizer

使用方法

  1. 启动调试
  2. Ctrl + Shift + P 打开命令面板，输入 Debug Visualizer: New View 打开一个新的可视化窗口
  3. 在可视化窗口输入需要展示的数据表达式

例子

在这里插入图片描述

参考文章

  1. VS Code 插件之 vscode-debug-visualizer
  2. VS Code 插件之 vscode-debug-visualizer
William.csj
关注
  • 2
    点赞
  • 踩
  • 5
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
vscode-debug-visualizer：VS Code的扩展，可在调试过程中可视化数据
02-04
VS代码调试可视化器 有关的自述文件，请参见 。 您可以在获得扩展。 有关构建说明和实现的详细信息，请参见 。
Data-Visualizer:数据可视化工具
05-13
数据可视化器 安装 安装依赖项和devDependencies并启动服务器。 $ git clone https://github.com/The-Atul-Sharma/Data-Visualizer.git $ npm install $ npm start 对于生产环境... $ npm run build 设置Eslint ... $ npm install --save-dev \ eslint-config-fbjs \ eslint-plugin-babel \ eslint-plugin-flowtype \ eslint-plugin-jsx-a11y \ eslint-plugin-react \ eslint-plugin-relay \ eslint \ babel-eslint Vscode工作区设置 “ editor.form
使用VSCode调试可视化的强大工具：VSCode Debug Visualizer
最新发布
gitblog_00012的博客
03-20 478
使用VSCode调试可视化的强大工具：VSCode Debug Visualizer 项目地址:https://gitcode.com/hediet/vscode-debug-visualizer 在这个数字化时代，软件开发人员需要高效且直观的工具来提升他们的工作效率和代码质量。VSCode Debug Visualizer 是一个出色的Visual Studio Code扩展，它将你的调试过程转...
手把手教你用Vscode Debugger调试代码
jfkidear的专栏
05-14 4万+
http://shooterblog.site/2018/05/19/%E6%89%8B%E6%8A%8A%E6%89%8B%E6%95%99%E4%BD%A0%E7%94%A8Vscode%20Debugger%E8%B0%83%E8%AF%95%E4%BB%A3%E7%A0%81/#Debugger-For-Chrome 手把手教你用Vscode Debugger调试代码 2018-05...
Visualizer Debug环境的建立
W1Z1Q的专栏
02-05 448
创建qwave.db波形和Visualizer仿真环境
配置VScode编译、调试STM32（二）Cortex-Debug插件
hanhe0551的博客
07-26 1万+
Github链接：https://github.com/ruomenganran/VScode_Debug_STM32 前文写到使用minGW、GNU for ARM和VScode组成编译调试链，今天又发现了一款VScode的插件，Cortex-Debug（marus25），可以用来debug ARM cortex-M系列单片机。 这款插件目前功能不多，但好在配置简单，读一下官方的文档 ，稍微配...
VsCode连接Mysql、Redis、MariaDB、SQL Server等数据库并进行可视化操作。无需额外的去下载可视化数据软件了，VsCode前端很方便的插件！！！
youyudehan的博客
09-27 1万+
VsCode连接Mysql、Redis、MariaDB、SQL Server等数据库并进行可视化操作。无需额外的去下载可视化数据软件了，VsCode前端很方便的插件！！！
如何用VsCode进行Debug
热门推荐
weixin_42962086的博客
03-04 6万+
如何用VsCode进行Debug 本文以Mac系统，C++程序为例，进行Debug操作 安装插件 不同的语言需要安装的debug插件不一样，如下 Debug页面 VsCode的Debug页面如下 配置Debug环境 点击左侧的Debug图标，默认情况下，展示的是配置提示 点击图中的【运行和调试】，选择【GDB/LLDB】环境，之后在下拉列表选择【默认配置】，系统自动创建launch.json文件，用于记录debug的配置信息，其中最主要的是配置调试的程序，program字段，选择要debug运行的
2023年VSCode插件最新推荐（54款）
qw_6918966011的博客
07-25 3万+
本文介绍前端开发领域常用的一些VSCode插件，插件是VSCode最重要的组成部分之一，本文列出了我自己在以往工作经验中积累的54款插件，个人觉得这些插件是有用或有趣的，根据它们的作用，我粗略的把它们分成了等几个模块。
2023年最新最全 VSCode 插件推荐
技术专家
03-07 7974
Visual Studio Code 是由微软开发的一款免费的、针对于编写现代Web和云应用的跨平台源代码编辑器。它包含了一个丰富的插件市场，提供了很多实用的插件。
使用Vscode进行Vue的debug调试功能，研究了一天终于可以了，同时解决Unbound breakpoint灰点问题
04-21 2万+
实现的结果：在vscode中可以直接debug上一步下一步等，同时在浏览器里面也可以执行这样的操作，这样的debug功能，谁不想要呢？谁还没有呢？是不是你，哈哈哈哈。
zookeeper-visualizer:zookeeper的可视化管理工具
05-13
zookeeper-visualizerzookeeper的可视化管理工具简介zookeeper-visualizer是zookeeper的可视化管理工具, 用Java8编写, 使用JAVAFX2.0进行ui设计会持续更新, 欢迎提需求环境jdk 1.8.0_60+功能树形箭头往下即可监听...
rollup-plugin-visualizer::chart_increasing::balance_scale:可视化您的捆绑包
04-02
汇总插件可视化器 可视化并分析您的Rollup捆绑包，以查看哪些模块占用了空间。 屏幕截图 安装 npm install --save-dev rollup-plugin-visualizer 或通过纱线： yarn add --dev rollup-plugin-visualizer V5升级 ...
clj-graph-visualizer:一个Clojure项目以可视化图形
05-17
clj-graph-visualizer clj-graph-visualizer只是评估如何处理非常大的图的实验。 安装 $ ./lein.sh uberjar 用法 $ java -jar clj-graph-visualizer1-0.1.0-standalone.jar 演示版 最初，该图仅具有根名称“ root...
[C#]有趣的VS扩展DebuggerVisualizer
weixin_30326515的博客
05-09 172
公司的研发平台底层封装了一种类似于DataTable的数据结构，具有行列特性但是直接基于键值对，每次调试时想要查看其中的内容都非常困难。不由得想起第一次使用VS调试Dataset时候弹出的哪个框，鉴于此，搜索了大量资料，在走过一些弯路后终于尝试成功，特记录于此，以备后效。 1.几个主要的概念 　　1.DebuggerVisualizer：MSDN的说明中描述了一些基础的步骤，这个类位于Syst...
VsCode中Debug调试插件配置
天天开心鸭！
09-05 6万+
第一步：环境配置 确保你的Chrome安装在默认位置 确保你的VS Code里面安装了Debugger for Chrome这个插件 把@angular/cli安装到全局空间npm install -g @angular/cli，国内用户请使用cnpm进行安装。注意，你最好升级到最新版本的@angular/cli，避免版本兼容问题。 用@angular/cli创建新项目ng new my-...
VS Code里使用Debugger for Unity插件进行调试(2023最新版)
问渠哪得清如许，为有源头活水来
01-06 1万+
如何在最新版Visual Studio Code中进行Unity的调试
超轻量级的VSCode插件，数据库想用就用～
NimbleX_的博客
09-13 1766
超轻量级的VSCode插件，数据库想用就用～
推荐13款常用的Vscode插件，提高前端日常开发效率
DEVELOPERAA的博客
11-02 2万+
推荐13款常用的Vscode插件，提高前端日常开发效率
rollup-plugin-visualizer
09-02
rollup-plugin-visualizer是一个Rollup插件，用于可视化分析打包后的代码。当我们使用Rollup打包我们的项目时，通常会生成一个压缩且优化过的bundle.js文件，其中包含了我们所有的JavaScript代码和依赖。然而，这个bundle.js文件往往很难阅读和理解，特别是当我们的项目较大时。 这就是rollup-plugin-visualizer发挥作用的地方。它可以生成一个可视化报告，帮助我们更好地了解我们的代码结构。这个报告以可视化图表的形式展示我们代码的各个模块的大小，包括它们所占用的字节数、依赖关系和相对路径等。 使用rollup-plugin-visualizer非常简单。我们只需要在Rollup的配置文件中引入这个插件，并将其作为一个插件使用。一旦我们重新运行Rollup打包，它就会在输出目录中生成一个名为stats.html的报告文件。我们可以通过在浏览器中打开这个文件来查看报告。 通过查看这个报告，我们可以快速发现我们的代码中存在的问题。比如，我们可能会发现一些模块太大而导致加载时间过长。或者我们可能会发现一些模块没有被使用，从而给我们找出并移除不必要的代码提供了帮助。 总的来说，rollup-plugin-visualizer是一个非常有用的工具，可以帮助我们优化和改进我们的项目。通过可视化分析我们的代码，我们可以更好地了解它的结构和性能，并针对性地进行优化。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值