无法连接到目标:连接ECONNREFUSED 127.0.0.1:9222

时间:2016-04-22 01:19:11

标签: angularjs visual-studio-code

我正在尝试使用vscode调试我的角度代码但不起作用。

enter image description here     无法连接到目标:连接ECONNREFUSED 127.0.0.1:9222

9 个答案:

答案 0 :(得分:12)

我不确定你是否仍然需要它,但我找到了解决方案,因为我自己也遇到了同样的问题。

您必须启用Chrome并启用远程调试,以便将扩展程序附加到其上。

<强>窗

右键单击Chrome快捷方式,然后选择属性 在“目标”字段中,追加--remote-debugging-port = 9222 或者在命令提示符下,执行/chrome.exe --remote-debugging-port = 9222

OS X

在终端中,执行/ Applications / Google \ Chrome.app/Contents/MacOS/Google \ Chrome --remote-debugging-port = 9222

<强>的Linux

在终端中,启动google-chrome --remote-debugging-port = 9222

我在vs code chrome扩展程序的github上找到了这个信息: https://github.com/Microsoft/vscode-chrome-debug

注意 - 如果您已经运行了Chrome实例。在打开更新的Chrome窗口之前先关闭它们。参考: - https://github.com/Microsoft/vscode-chrome-debug/issues/111

答案 1 :(得分:1)

我收到此错误消息是因为我忘记了自上次运行应用程序以来就关闭了chrometab。 只需关闭这些选项卡,即可重新运行。

答案 2 :(得分:0)

digaomatias

添加的详细信息的附加组件
  

注意:在打开更新的Chrome窗口之前,停止运行Chrome实例/标签页。

来自Github的参考。

答案 3 :(得分:0)

如果您在Windows中运行此应用程序,并显示此消息,请尝试仅重新启动计算机。 这对我有用!

答案 4 :(得分:0)

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.

答案 5 :(得分:0)

我能够通过停止调试器,关闭所有正在运行的Chrome窗口,然后重新启动调试器来解决此问题。请注意,我正在使用IIS Express。

答案 6 :(得分:0)

只需关闭视觉工作室,然后再次将其打开。它解决了我的问题

答案 7 :(得分:0)

我将 Visual Studio Code 更新到最新版本,问题得到解决。

答案 8 :(得分:-2)

像这样使用:

{
    "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"
}