VSCode下载、安装及配置、调试的一些过程理解

第一步先下载了vscode,官方地址为:https://code.visualstudio.com/Download

第二步安装vscode,安装环境是win10,安装基本上就是一步步默认即可。

第三步汉化vscode,这一步就是去扩展插件里面下载一个中文插件即可,基本操作为,在左侧的extension中输入chinese simp就出来了,然后点右侧的install就行了,安装完了重启就显示中文界面了。

第四步,因为听说vscode支持js运行调试,就想着怎么调试,先写了一个js文件,然后看有个运行和调试按钮,去选择nodejs运行,发现报错,没用node运行时runtime环境,看网上说的下去下载nodejs,下载地址:下载 | Node.jsNode.js® is a JavaScript runtime built on Chrome's V8 JavaScript engine.icon-default.png?t=N7T8https://nodejs.org/zh-cn/download

下载windows环境下的msi,直接安装就行,安装完了默认变量都添加好了,不用太多操作。

第五步,点击“运行和调试”最右侧的按钮,添加一个配置,vscode是默认支持nodejs的,因此安装完了node后,点击配置按钮会自动生成一个launch.json文件。

如果我们默认通过vscode 来调试代码,会生成一个launch.json 配置文件, 详细细节可以查看官方文档Debugging in Visual Studio CodeOne of the great things in Visual Studio Code is debugging support. Set breakpoints, step-in, inspect variables and more.icon-default.png?t=N7T8https://code.visualstudio.com/docs/editor/debugging关于配置,我们这里只说说我们一般会常用的地方。

launch.json 配置项
必选字段
type:调试器类型。这里是 node(内置的调试器),如果装了 Go 和 PHP 的扩展后对应的 type 分别为 go 和 php
request:请求的类型,目前只支持 launch 和 attach。launch 就是以 debug 模式启动调试,attach 就是附加到已经启动的进程开启 debug 模式并调试,跟上一篇提到的用 node -e "process._debugProcess(PID)" 作用一样
name:下拉菜单显示的名字

可选字段
program:可执行文件或者调试器要运行的文件 (launch)
args:要传递给调试程序的参数 (launch)
env:环境变量 (launch)
cwd:当前执行目录 (launch)
address:ip 地址 (launch & attach)
port:端口号 (launch & attach)
skipFiles:想要忽略的文件,数组类型 (launch & attach)
processId:进程 PID (attach)
同时目录变量有
${workspaceRoot}:当前打开工程的路径
${file}:当前打开文件的路径
${fileBasename}:当前打开文件的名字,包含后缀名
${fileDirname}:当前打开文件所在的文件夹的路径
${fileExtname}:当前打开文件的后缀名
${cwd}:当前执行目录
通常一个默认的launch.json 默认配置如下
{
    "version": "0.2.1",
    "configurations": [
        {
            "type": "node",
            "request": "launch",
            "name": "启动程序",
            "program": "${workspaceFolder}/index.js"
        }
    ]
}

这个配置会直接运行index.js 我们项目目录下的index.js 文件。我们可以根据上面的配置信息 自动的定义我们启动运行的文件。

关于调试js代码,如果用vscode自带的调试,就是左上角的“运行和调试”按钮,快捷键就是F5,这个是vscode软件本身的,不是任何插件的,如果安装了node.js exec,可以通过f8运行js文件,这个是node.js exec的快捷键运行,不是vscode的,vscode这个通用的运行调试按钮,对所有文件能用。

直接运行F5,按照配置launch.json文件中的参数,然后通过shell去执行一个node xxx.js文件,上图中的调试控制台的黄色字母部分,这个可以vscode的终端窗口去执行试试。

我看网上有人安装了nodejs后直接用终端这么调试,为啥不去F5呢。

安装了node.js exec后,可以在js文件中运行F8,此时输出窗口如下:

此时右侧的运行环境为nodejs,如果换成quokka,我的理解是该插件包了一层壳,运行代码不再是node xxx.js,而是quokka xxx.js,壳子外面自己加了显示信息:

后来看网上说也能调试java,就装了extension pack for java插件,装了之后,在java文件里面就可以直接运行 run java了。

当我想在浏览器显示我的html的时候,装了live server的静态服务插件,可以用来启动浏览器并显示html的内容。

如果想浏览器实时反馈文件修改,选择【Open with Live Server】

浏览器界面:查看html标签和布局

浏览器【开发者工具】-【Console】:查看 console.log() 输出

浏览器弹窗:查看 window.alert() 输出

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/63860.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

ArcGIS地块面积分割调整工具插件

地块分割调整工具可以实现将选定的图斑按照面积比例或者指定的面积,分割成多个图斑。 各个图斑的面积用逗号分隔,比例分割设置时,用整数表示。 面积分割时,最后一个图斑的面积可以不写,插件可以自动计算图斑的面积&a…

【常用代码】折半插入算法

王道的折半插入排序的代码太难懂了&#xff0c;上网搜了个这个看着比较好用 并且这个算法应该是不稳定的&#xff0c;同样的数值&#xff0c;后进来的插到前面去了。 // C program for implementation of // binary insertion sort #include <stdio.h>// A binary searc…

c++ 学习 之 构造函数的分类和调用类型 深入学习

正文 构造函数是在C中用于创建和初始化对象的特殊函数。构造函数可以根据不同的特性和参数进行分类&#xff0c;以下是一些常见的构造函数分类和详细讲解它们的调用方式&#xff1a; 默认构造函数&#xff1a; 默认构造函数是一个特殊的构造函数&#xff0c;它没有参数&#x…

day-36 代码随想录算法训练营(19)part05

435.无重叠区间 思路&#xff1a;首先对数组排序&#xff0c;只需要关注重叠区间就行&#xff0c;有重叠时计数1&#xff0c;然后更新当前右边界为重叠区间中的最小右边界。 763.划分字母区间 思路&#xff1a;记录每一个字母的最远位置&#xff0c;然后从头开始遍历&#xf…

Java如何发起http的get请求的实现

加哥最近做第三方接口开发&#xff0c;对方提供的是get方式的http请求&#xff0c;下面加哥给大家进行了总结如何用java代码去发送http请求并获取结果。 下面是发送get请求的工具类 1.不要求携带token的方式 public static String getUrl(String tempurl,String bm) {String…

ARM DIY(四)WiFi 调试

文章目录 焊接打开内核编译选项重新编译内核烧录 && 运行 && 测试完善脚本测速手搓天线正式天线 焊接 换个粗点的风枪嘴&#xff0c;让热风覆盖 RTL8823BS 整体模块&#xff0c;最终实现自动归位 焊接 SDIO 接口的上拉电阻以及复位引脚上拉电阻 硬件部分就这…

【C++】map和set

map和set 文章目录 map和set关联式容器setset介绍set的函数测试代码 multiset注意事项测试代码 mapmap介绍map的函数测试代码 关联式容器 前面了解过的vector&#xff0c;list&#xff0c;string等容器都是序列式容器&#xff0c;存储的都是元素本身&#xff0c;底层都是线性的…

七、Kafka-Kraft 模式

目录 7.1 Kafka-Kraft 架构7.2 Kafka-Kraft 集群部署 7.1 Kafka-Kraft 架构 左图为 Kafka 现有架构&#xff0c;元数据在 zookeeper 中&#xff0c;运行时动态选举 controller&#xff0c;由controller 进行 Kafka 集群管理 右图为 kraft 模式架构&#xff08;实验性&#xff…

001图机器学习与图神经网络简介

文章目录 一. 无处不在的图二. 如何对图数据做信息挖掘三. 图神经网络四. 图机器学习常用的编程工具五. 图的可视化工具六. 常见的图数据库七. 图机器学习的应用举例八. 结束语 一. 无处不在的图 一切具有关联关系的数据都可以用图来表示。比如&#xff1a;交通网、知识图谱、…

Vim如何清空文件

在Vim中&#xff0c;可以使用以下命令清空文件内容&#xff1a; 打开需要清空的文件&#xff1a;在终端中输入vim filename打开文件&#xff0c;其中filename是你要编辑的文件名。 进入命令模式&#xff1a;按下键盘上的Esc键&#xff0c;确保处于Vim的命令模式。&#xff08;…

C# excel与DataTable之间的转换

注意&#xff0c;Excel读入DataTable需要使用NPOI包 /// <summary>/// Excel导入成Datable/// </summary>/// <param name"file">导入路径(包含文件名与扩展名)</param>/// <returns></returns>public static DataTable ExcelT…

pdf加密如何解除?这样解除加密很简单

pdf加密如何解除&#xff1f;有时&#xff0c;我们可能会收到一些加密的PDF文件&#xff0c;它们不允许我们对其进行编辑或打印。这时&#xff0c;我们需要使用PDF解密工具&#xff0c;以便能够轻松地解除PDF加密并对其进行编辑。那么接下来就给大家介绍一下pdf加密解除的方法。…

Compose - 自定义作用域限制函数

一、概念 在 Compose 中对于作用域的应用特别多。比如 weight 修饰符只能用在 RowScope 或者 ColumnScope 作用域中&#xff0c;item 组件只能用在 LazyListScope 作用域中。 标准库中的作用域函数如 apply()、let() 会以不同方式持有和返回上下文对象&#xff0c;调用它们时 L…

RISC-V Linux系统rootfs制作

文章目录 1、下载2、配置与编译3、运行 buildroot 是一个构建嵌入式Linux系统的框架。整个 buildroot 是由Makefile(*.mk) 脚本和 Kconfig(Config.in) 配置文件构成的&#xff0c;因此可以像配置 Linux 内核一样执行 make menuconfig 进行配置&#xff0c;编译出一个完整的、可…

SPI3+DMA外设驱动-TFTLCD初始化

前言 &#xff08;1&#xff09;本系列是基于STM32的项目笔记&#xff0c;内容涵盖了STM32各种外设的使用&#xff0c;由浅入深。 &#xff08;2&#xff09;小编使用的单片机是STM32F105RCT6&#xff0c;项目笔记基于小编的实际项目&#xff0c;但是博客中的内容适用于各种单片…

内网隧道代理技术(二十)之 CS使用HTTP代理上线不出网机器

CS使用HTTP代理上线不出网机器 CS工具自带上线不出网机器 如图A区域存在一台中转机器,这台机器可以出网,这种是最常见的情况。我们在渗透测试的过程中经常是拿下一台边缘机器,其有多块网卡,边缘机器可以访问内网机器,内网机器都不出网。这种情况下拿这个边缘机器做中转,…

VsCode搭建Java开发环境 vscode搭建java开发环境 vscode springboot 搭建springboot

VsCode搭建Java开发环境 vscode搭建java开发环境 vscode springboot 搭建springboot VsCode java开发截图1、安装Java 环境相关插件2、安装 Spring 插件3、安装 Mybatis 插件第一个 vsc-mybatis第二个 mybatisX 4、安装Maven环境4.1、安装Maven环境4.2、VsCode配置Maven环境 5、…

vite vue项目打包后双击index.html(file://...)无法正常浏览解决

写一个Webview本地加html的项目&#xff0c;html用vite vue3写&#xff0c;打包后http访问没有问题&#xff0c;放在APP内file访问白屏报错&#xff0c;查了2天无解。最终看到Vue3 Vite项目打包静态文件之后无法以file协议访问找到思路。在此文启发下做了些改善记录。 一、文件…

视频汇聚/视频监控管理平台EasyCVR接入海康SDK协议后无法播放该如何解决?

开源EasyDarwin视频监控/安防监控/视频汇聚EasyCVR能在复杂的网络环境中&#xff0c;将分散的各类视频资源进行统一汇聚、整合、集中管理&#xff0c;在视频监控播放上&#xff0c;视频安防监控汇聚平台可支持1、4、9、16个画面窗口播放&#xff0c;可同时播放多路视频流&#…

Rust的模块化

Rust的模块化要从Rust的入口文件谈起。 Rust的程序的入口文件有两个 如果程序类型是可执行应用&#xff0c;入口文件是main.rs&#xff1b;如果程序类型是库&#xff0c;入口文件是lib.rs&#xff1b; 入口文件中&#xff0c;必须声明本地模块&#xff0c;否则编译器在编译过…