平面设计网站制作,开发者选项,优秀网站设计流程,网站布局介绍第一步先下载了vscode#xff0c;官方地址为#xff1a;https://code.visualstudio.com/Download
第二步安装vscode#xff0c;安装环境是win10#xff0c;安装基本上就是一步步默认即可。
第三步汉化vscode#xff0c;这一步就是去扩展插件里面下载一个中文插件即可官方地址为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 Chromes V8 JavaScript engine.https://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.https://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) addressip 地址 (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() 输出
