1 问题描述

在html文件中写js代码，然后在vscode中打开html文件，按F5打开浏览器进行调试，打开的浏览器没有自己下载的插件等内容，完全是一个新的配置。

2 原因

vscode打开浏览器会使用自己的独立于用户的配置，这个配置位于C:\Users\26955\AppData\Roaming\Code\User\workspaceStorage\5c089b2fcae74d3d2eb663707d5b2bee\ms-vscode.js-debug\.profile

如果你的配置不在这个位置，使用listary搜索ClientSidePhishing这个文件夹，就能找到

而用户的chrome配置在C:\Users\26955\AppData\Local\Google\Chrome\User Data

3 解决方法

用vscode打开html文件，运行( R ) -> 添加配置 -> Web应用(chrome) -> 在打开的launch.json里添加两个参数runtimeExecutable和runtimeArgs.

{
    // 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": [
        {
            "name": "Open test.html",
            "type": "chrome",
            "runtimeExecutable": "C:/Program Files/Google/Chrome Dev/Application/chrome.exe", // 你的浏览器位置
            "runtimeArgs": ["--user-data-dir", "C:/Users/26955/AppData/Local/Google/Chrome Dev/User Data"], // 第二个参数是你的浏览器配置的位置
            "request": "launch",
            "file": "d:\\vscode\\test.html" // 要调试的文件
        }
    ]
}

参考：vscode官方文档-browser-debugging