vscode JavaScript Debugger配置 vscode配置js环境

作者：虚坏叔叔

早餐店不会开到晚上，想吃的人早就来了！😄

Js逆向教程21-vscode无环境联调

一、环境安装

电脑安装visual code

电脑安装node.js

二、nodejs环境调试

vscode打开一个文件夹并创建demo.js文件

打开node.js配置

{
    // Use IntelliSense to learn about possible attributes.
    // Hover to view descriptions of existing attributes.
    // For more information, visit: https://go.microsoft.com/fwlink/?linkid=830387
    "version": "0.2.0",
    "configurations": [
        {
            "type": "node",
            "request": "launch",
            "name": "Launch Program",
            "skipFiles": [
                "<node_internals>/**"
            ],
            "program": "${workspaceFolder}\\demo.js"
        }
    ]
}

运行调试

2.1 npm的插件环境位置

C:\Users\Administrator\AppData\Roaming\npm

2.2 nodejs安装位置环境变量

三、安装node-inspect插件

npm install -g node-inspect

命令行输入插件名称说明安装成功

3.1打开模块地址

C:\Users\Administrator\AppData\Roaming\npm\node-inspect

C:\Users\Administrator\AppData\Roaming\npm\node_modules\node-inspect

C:\Users\Administrator\AppData\Roaming\npm\node_modules\node-inspect

3.2配置启动项

{
    // Use IntelliSense to learn about possible attributes.
    // Hover to view descriptions of existing attributes.
    // For more information, visit: https://go.microsoft.com/fwlink/?linkid=830387
    "version": "0.2.0",
    "configurations": [
        {
            "type": "node",
            "request": "launch",
            "name": "Launch Program",
            "skipFiles": [
                "<node_internals>/**"
            ],
            "program": "${workspaceFolder}\\demo.js"
        },
        
        {
            "type": "node",
            "request": "launch",
            "name": "无环境浏览器调试",
            "skipFiles": [
                "<node_internals>/**"
            ],
            "runtimeExecutable": "node-inspect",
            "program": "${workspaceFolder}\\demo.js"
        }
    ]
}

3.3谷歌内核开启实验地址

chrome://flags/

开启后会发现这里有变化：

这里如果是绿色 说明node正在调试。如果关闭掉 就没有这个图标。

点击这个图标 可以看到弹出了一个调试框，这个调试是没有浏览器window环境的

这样就可以帮助你在浏览器进行调试。

总结

最后的最后
由本人水平所限，难免有错误以及不足之处， 屏幕前的靓仔靓女们 如有发现，恳请指出！

最后，谢谢你看到这里，谢谢你认真对待我的努力，希望这篇博客对你有所帮助！