blocks|key|5703524|text|我不确定你是否还需要它，但我找到了解决方案，因为我自己也面临着同样的问题。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|5703525|您必须在启用远程调试的情况下启动Chrome，以便将扩展附加到它。|5703526|Windows|offset|length|style|BOLD|5703527|右键单击Chrome快捷方式，在“目标”字段中选择属性，追加--远程调试-端口=9222或在命令提示符下执行/chrome.exe+--远程调试-端口=9222|5703528|OS+X|5703529|在终端中，执行/Applications/Google\+Chrome.app/Contents/MacOS/Google\+Chrome+--remote-debugging+port=9222|5703530|Linux|5703531|在终端中，启动google-chrome+--remote-debugging+port=9222|5703532|我在vs+code+chrome扩展的github上找到了这个信息：https://github.com/Microsoft/vscode-chrome-debug|5703533|注意--如果你已经运行了Chrome的实例。在打开更新后的Chrome窗口之前，请先关闭它们。参考：-+https://github.com/Microsoft/vscode-chrome-debug/issues/111|5703534|entityMap|0|LINK|mutability|MUTABLE|url|https://github.com/Microsoft/vscode-chrome-debug|1|https://github.com/Microsoft/vscode-chrome-debug/issues/111^0|0|0|0|7|0|0|0|4|0|0|0|5|0|0|Y|1C|0|0|1G|1N|1|0^^$0|@$1|2|3|4|5|6|7|17|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|18|8|@]|9|@]|A|$]]|$1|D|3|E|5|6|7|19|8|@$F|1A|G|1B|H|I]]|9|@]|A|$]]|$1|J|3|K|5|6|7|1C|8|@]|9|@]|A|$]]|$1|L|3|M|5|6|7|1D|8|@$F|1E|G|1F|H|I]]|9|@]|A|$]]|$1|N|3|O|5|6|7|1G|8|@]|9|@]|A|$]]|$1|P|3|Q|5|6|7|1H|8|@$F|1I|G|1J|H|I]]|9|@]|A|$]]|$1|R|3|S|5|6|7|1K|8|@]|9|@]|A|$]]|$1|T|3|U|5|6|7|1L|8|@]|9|@$F|1M|G|1N|1|1O]]|A|$]]|$1|V|3|W|5|6|7|1P|8|@]|9|@$F|1Q|G|1R|1|1S]]|A|$]]|$1|X|3|-4|5|6|7|1T|8|@]|9|@]|A|$]]]|Y|$Z|$5|10|11|12|A|$13|14]]|15|$5|10|11|12|A|$13|16]]]]

I'm not sure you still need it, but I found the solution, since I was facing the same issue myself. 

You must launch Chrome with remote debugging enabled in order for the extension to attach to it.

Windows

Right click the Chrome shortcut, and select properties
In the "target" field, append --remote-debugging-port=9222
Or in a command prompt, execute /chrome.exe --remote-debugging-port=9222

OS X

In a terminal, execute /Applications/Google\ Chrome.app/Contents/MacOS/Google\ Chrome --remote-debugging-port=9222

Linux

In a terminal, launch google-chrome --remote-debugging-port=9222

I've found this info on the vs code chrome extension's github:
<a href="https://github.com/Microsoft/vscode-chrome-debug" rel="noreferrer">https://github.com/Microsoft/vscode-chrome-debug</a>

Note - If you have already running instances of Chrome. Close them first before opening the updated Chrome window. Ref:- <a href="https://github.com/Microsoft/vscode-chrome-debug/issues/111" rel="noreferrer">https://github.com/Microsoft/vscode-chrome-debug/issues/111</a>

blocks|key|1704944|text|我得到这个错误是因为我忘记关闭应用程序上次运行时的chrometabs。只需关闭这些选项卡，您就可以再次启动并运行。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1704945|entityMap^0|0^^$0|@$1|2|3|4|5|6|7|D|8|@]|9|@]|A|$]]|$1|B|3|-4|5|6|7|E|8|@]|9|@]|A|$]]]|C|$]]

I got this error because I forgot to close the chrometabs from the previous time the application ran.
Just close those tabs and you are up and running again.

blocks|key|4286577|text|如果您在windows中运行此应用程序，并显示此消息，请尝试重新启动您的计算机。这对我来说很有效！|type|unstyled|depth|inlineStyleRanges|entityRanges|data|4286578|entityMap^0|0^^$0|@$1|2|3|4|5|6|7|D|8|@]|9|@]|A|$]]|$1|B|3|-4|5|6|7|E|8|@]|9|@]|A|$]]]|C|$]]

If you running this application in windows, and show you this message, try just restart your machine.
This works for me!

blocks|key|5703555|text|digaomatias添加的详细信息的附加组件|type|unstyled|depth|inlineStyleRanges|offset|length|style|CODE|entityRanges|data|5703556|5703557|+备注：在打开更新后的Chrome窗口之前，停止已经在运行的Chrome实例/标签。|blockquote|BOLD|5703558|5703559|5703560|来自Github的引用。|5703561|entityMap|0|LINK|mutability|MUTABLE|url|https://github.com/Microsoft/vscode-chrome-debug/issues/111^0|0|B|0|0|1|2|0|0|0|2|6|0|0^^$0|@$1|2|3|4|5|6|7|W|8|@$9|X|A|Y|B|C]]|D|@]|E|$]]|$1|F|3|-4|5|6|7|Z|8|@]|D|@]|E|$]]|$1|G|3|H|5|I|7|10|8|@$9|11|A|12|B|J]]|D|@]|E|$]]|$1|K|3|-4|5|6|7|13|8|@]|D|@]|E|$]]|$1|L|3|-4|5|6|7|14|8|@]|D|@]|E|$]]|$1|M|3|N|5|6|7|15|8|@]|D|@$9|16|A|17|1|18]]|E|$]]|$1|O|3|-4|5|6|7|19|8|@]|D|@]|E|$]]]|P|$Q|$5|R|S|T|E|$U|V]]]]

Add-on to the details added by <code>digaomatias</code>

<blockquote>
 Note: Stop already running Chrome instances/tabs before opening the updated Chrome window.
</blockquote>

Reference from <a href="https://github.com/Microsoft/vscode-chrome-debug/issues/111" rel="nofollow">Github</a>.

blocks|key|2174024|text|我能够通过停止调试器，关闭所有正在运行的Chrome窗口，然后重新启动调试器来解决这个问题。请注意，我使用的是IIS+Express。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|2174025|entityMap^0|0^^$0|@$1|2|3|4|5|6|7|D|8|@]|9|@]|A|$]]|$1|B|3|-4|5|6|7|E|8|@]|9|@]|A|$]]]|C|$]]

I was able to resolve this issue by stopping the debugger, closing all of my running Chrome windows, and then re-starting the debugger. Note that I'm using IIS Express.

blocks|key|5703587|text|To+test+and+debug+in+vs+code+with+angular+and+karma+here+is+a+solution,
++++angular+test+case+to+work+you+have+to+make+a+setting+in+2+files,


+1.+Karm.conf.json+(+this+is+a+file+that+set+your+karma+test+runner.
+2.+LaunchSetting.json+(+this+is+file+used+by+your+Chome+Debugger+extension+in+vs+code)


++++So+always+first+you+have+to+run+your+karma+test+runner,+on+that+port+and+then+you+can+attach+debugger+on+running+port.

++++Step+1)+Setup+Karma.conf.json,
++++open+default+file+created+by+cli,
++++you+got+something+like+this,
+++++++++port:+9876,
++++++++colors:+true,
++++++++logLevel:+config.LOG_INFO,
++++++++autoWatch:+true,
++++++++browsers:+['Chrome'],

++++if+you+run+ng+test,+you+see+in+console+you+got+some+info+like+is+Chrome+is+running,+as+well+a+page+will+open+in+browser+with+http://localhost:9876,

++++Now+time+to+add+headlesschrome+with+port+9222,

++++inside+config.set,+add+this,

++++++++customLaunchers:{
++++++++++++++ChromeHeadless:{
++++++++++++++++base:'Chrome',
++++++++++++++++flags:[
++++++++++++++++++'--headless',
++++++++++++++++++'--disable-gpu',
++++++++++++++++++'--no-sandbox',
+++++++++++++++++//+Without+a+remote+debugging+port,+Google+Chrome+exits+immediately.
++++++++++++++++++'--remote-debugging-port=9222',
++++++++++++++++]
++++++++++++++}
++++++++++++}

++++and+now+go+and+add+to+the+browser+array+ChoromeHeadless,+so+updated+array+will+look+like+this,+browsers:+['Chrome','ChromeHeadless'],

++++now+run+ng+test+you+got+in+console+chrome+and+chrome+headless+both+running,

+Step+2)+++Time+to+set+up+your+launcher,+to+debug+on+9222,+debug+to+work+you+need+sourcmap+creation+to+work+properly,+that+is+important,
so+for+same+to+work+just+copy-paste+config+setting+from+below+configuration+array+to+your+launchsetting.json+configuration+array+as+new+config,




++++configurations:+[
++++++++{
++++++++++++++++++++"name":+"Attach+to+Chrome,+with+sourcemaps",
++++++++++++++++++++"type":+"chrome",
++++++++++++++++++++"request":+"attach",
++++++++++++++++++++"port":+9222,
++++++++++++++++++++"webRoot":+"${workspaceFolder}",
++++++++++++++++++++"sourceMapPathOverrides":+{
++++++++++++++++++++++++"*":+"${webRoot}/*",
++++++++++++++++++++},
++++++++++++++++++++"sourceMaps":+true,
++++++++}
++++++++]

++++run+ng+test,+and+then+go+to+debugger+choose+the+config+we+add,+your+debugger+working,

if+you+using+npm+run+test,+then+make+sure+in+your+package.config+where+you+define+a+run+test,+you+have+not+set+source+map+to+false,+if+not+then+you+can+set+debugger+with,
npm+run+test+as+well.|type|code-block|depth|inlineStyleRanges|entityRanges|data|syntax|javascript|5703588|unstyled|entityMap^0|0^^$0|@$1|2|3|4|5|6|7|G|8|@]|9|@]|A|$B|C]]|$1|D|3|-4|5|E|7|H|8|@]|9|@]|A|$]]]|F|$]]

<pre><code>To test and debug in vs code with angular and karma here is a solution,
 angular test case to work you have to make a setting in 2 files,


 1. Karm.conf.json ( this is a file that set your karma test runner.
 2. LaunchSetting.json ( this is file used by your Chome Debugger extension in vs code)


 So always first you have to run your karma test runner, on that port and then you can attach debugger on running port.

 Step 1) Setup Karma.conf.json,
 open default file created by cli,
 you got something like this,
 port: 9876,
 colors: true,
 logLevel: config.LOG_INFO,
 autoWatch: true,
 browsers: ['Chrome'],

 if you run ng test, you see in console you got some info like is Chrome is running, as well a page will open in browser with http://localhost:9876,

 Now time to add headlesschrome with port 9222,

 inside config.set, add this,

 customLaunchers:{
 ChromeHeadless:{
 base:'Chrome',
 flags:[
 '--headless',
 '--disable-gpu',
 '--no-sandbox',
 // Without a remote debugging port, Google Chrome exits immediately.
 '--remote-debugging-port=9222',
 ]
 }
 }

 and now go and add to the browser array ChoromeHeadless, so updated array will look like this, browsers: ['Chrome','ChromeHeadless'],

 now run ng test you got in console chrome and chrome headless both running,

 Step 2) Time to set up your launcher, to debug on 9222, debug to work you need sourcmap creation to work properly, that is important,
so for same to work just copy-paste config setting from below configuration array to your launchsetting.json configuration array as new config,




 configurations: [
 {
 "name": "Attach to Chrome, with sourcemaps",
 "type": "chrome",
 "request": "attach",
 "port": 9222,
 "webRoot": "${workspaceFolder}",
 "sourceMapPathOverrides": {
 "*": "${webRoot}/*",
 },
 "sourceMaps": true,
 }
 ]

 run ng test, and then go to debugger choose the config we add, your debugger working,

if you using npm run test, then make sure in your package.config where you define a run test, you have not set source map to false, if not then you can set debugger with,
npm run test as well.
</code></pre>

blocks|key|4286629|text|只需关闭visual+studio并再次打开它。它解决了我的问题|type|unstyled|depth|inlineStyleRanges|entityRanges|data|4286630|entityMap^0|0^^$0|@$1|2|3|4|5|6|7|D|8|@]|9|@]|A|$]]|$1|B|3|-4|5|6|7|E|8|@]|9|@]|A|$]]]|C|$]]

Simply close the visual studio and open it again. It has solved my problem

blocks|key|5703779|text|我将Visual+Studio代码更新为最新版本，问题已得到解决。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|5703780|entityMap^0|0^^$0|@$1|2|3|4|5|6|7|D|8|@]|9|@]|A|$]]|$1|B|3|-4|5|6|7|E|8|@]|9|@]|A|$]]]|C|$]]

I updated the Visual Studio Code to the latest version, the issue got resolved.

blocks|key|2174181|text|这是一个关于调试器浏览器的问题。我是这样解决的：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|2174182|用于VS+|2174183|unordered-list-item|2174184|
的微软边缘工具中的|2174185|Install+VS+Code+add|ordered-list-item|2174186|2174187|2174188|创建启动配置，如下所示：|2174189|2174190|{“名称”：“启动微软边缘并打开边缘端口”，“请求”：“启动”，“类型”：“vscode-DevTools-devtools.debug”，"url"："https://localhost:3000/taskpane.html?_host_Info=Excel$Win32$16.01$en-US$$$$0"，"port"：9222，}|offset|length|2174191|Microsoft+Edge+Tools+for+VS+Code|2174192|然后F5开始调试。|2174193|entityMap|0|LINK|mutability|MUTABLE|url|https://localhost:3000/taskpane.html?\_host\_Info=Excel$Win32$16.01$en-US$$$$0|1|https://marketplace.visualstudio.com/items?itemName=ms-edgedevtools.vscode-edge-devtools^0|0|0|0|0|0|0|0|0|0|25|25|0|0|0|W|1|0|0^^$0|@$1|2|3|4|5|6|7|17|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|18|8|@]|9|@]|A|$]]|$1|D|3|-4|5|E|7|19|8|@]|9|@]|A|$]]|$1|F|3|G|5|6|7|1A|8|@]|9|@]|A|$]]|$1|H|3|I|5|J|7|1B|8|@]|9|@]|A|$]]|$1|K|3|-4|5|6|7|1C|8|@]|9|@]|A|$]]|$1|L|3|-4|5|6|7|1D|8|@]|9|@]|A|$]]|$1|M|3|N|5|J|7|1E|8|@]|9|@]|A|$]]|$1|O|3|-4|5|6|7|1F|8|@]|9|@]|A|$]]|$1|P|3|Q|5|6|7|1G|8|@]|9|@$R|1H|S|1I|1|1J]]|A|$]]|$1|T|3|U|5|6|7|1K|8|@]|9|@$R|1L|S|1M|1|1N]]|A|$]]|$1|V|3|W|5|6|7|1O|8|@]|9|@]|A|$]]|$1|X|3|-4|5|6|7|1P|8|@]|9|@]|A|$]]]|Y|$Z|$5|10|11|12|A|$13|14]]|15|$5|10|11|12|A|$13|16]]]]

It's a issue about the debugger Browser. I solved it like this:
<ol>
<li>Install VS Code add in Microsoft Edge Tools for VS Code
</li>
<li>Create a lauch config as:
<pre><code> {
 &quot;name&quot;: &quot;Launch Microsoft Edge and open the Edge DevTools&quot;,
 &quot;request&quot;: &quot;launch&quot;,
 &quot;type&quot;: &quot;vscode-edge-devtools.debug&quot;,
 &quot;url&quot;: &quot;https://localhost:3000/taskpane.html?_host_Info=Excel$Win32$16.01$en-US$$$$0&quot;,
 &quot;port&quot;: 9222,

 }
</code></pre>
</li>
</ol>
<a href="https://marketplace.visualstudio.com/items?itemName=ms-edgedevtools.vscode-edge-devtools" rel="nofollow noreferrer">Microsoft Edge Tools for VS Code</a>
Then F5 start to debug.

blocks|key|1707273|text|像这样使用：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1707274|{
++++"name":+"Launch+index.html",
++++"type":+"chrome",
++++"request":+"launch",
++++"file":+"${workspaceRoot}/index.html",
++++"userDataDir":+"${workspaceRoot}/out/chrome",
++++"runtimeExecutable":+"/Applications/Google+Chrome.app/Contents/MacOS/Google+Chrome"
}|code-block|syntax|javascript|1707275|entityMap^0|0|0^^$0|@$1|2|3|4|5|6|7|I|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|J|8|@]|9|@]|A|$E|F]]|$1|G|3|-4|5|6|7|K|8|@]|9|@]|A|$]]]|H|$]]

Use like this:

<pre><code>{
 "name": "Launch index.html",
 "type": "chrome",
 "request": "launch",
 "file": "${workspaceRoot}/index.html",
 "userDataDir": "${workspaceRoot}/out/chrome",
 "runtimeExecutable": "/Applications/Google Chrome.app/Contents/MacOS/Google Chrome"
}
</code></pre>

I am trying to debugg my angular code with vscode but doesnt work.

<a href="https://i.stack.imgur.com/zL4P2.png" rel="noreferrer"><img src="https://i.stack.imgur.com/zL4P2.png" alt="enter image description here"></a>
 Cannot connect to the target: connect ECONNREFUSED 127.0.0.1:9222

Cannot connect to the target: connect ECONNREFUSED 127.0.0.1:9222

翻译质量差，导致语言生硬或混乱。

没有提供实际的解决方法或示例。

解答不清晰，无法理解或解决问题。

页面排版不美观，阅读体验差。

文章

问答

视频

学习中心

腾讯云实验室

直播

竞赛

腾讯云代码分析专区

腾讯iOA零信任安全管理系统专区

腾讯云架构师技术同盟交流圈

腾讯云数据库专区

腾讯云顾问专区

腾讯云原生专区

腾讯混元专区

腾讯云TCE专区

腾讯云Lighthouse专区

腾讯云HAI专区

腾讯云Edgeone专区

腾讯云存储专区

腾讯云智能专区

腾讯轻联专区 

腾讯云开发专区

TAPD专区

腾讯轻量云游戏服专区

腾讯云最具价值专家

腾讯云架构师技术同盟

腾讯云创作之星

腾讯云开发者先锋

腾讯云代码助手

云原生构建

TAPD 敏捷项目管理

Cloud Studio

SDK中心

API中心

命令行工具

涵盖代码开发、场景应用、自动测试全流程，助你从零构建专属AI助手

一站式MCP教程库，解锁AI应用新玩法

我试着用vscode调试我的angular代码，但不起作用。​ Cannot connect to the target: connect ECONNREFUSED 127.0.0.1:9222

问无法连接到目标: connect ECONNREFUSED 127.0.0.1:9222
EN

回答 10

Stack Overflow用户

Stack Overflow用户

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问无法连接到目标: connect ECONNREFUSED 127.0.0.1:9222EN

回答 10

Stack Overflow用户

Stack Overflow用户

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问无法连接到目标: connect ECONNREFUSED 127.0.0.1:9222
EN