4

I'm trying to debug a yeoman generator in visual studio code but it keeps telling me that it cannot launch programm d:\repos\generator\node_modules\.bin\yo'; enabling source maps might help everytime I hit F5

My VS Code config File looks like this:

{
    "version": "0.1.0",
    "configurations": [
        {
            // Name of configuration; appears in the launch configuration drop down menu.
            "name": "Launch app/index.js",
            // Type of configuration. Possible values: "node", "mono".
            "type": "node",
            // Workspace relative or absolute path to the program.
            "program": "node_modules/.bin/yo",
            // Command line arguments passed to the program.
            "args": [ "design" ],
            // Workspace relative or absolute path to the working directory of the program being debugged. Default is the current workspace.
            "cwd": ".",
            // Workspace relative or absolute path to the runtime executable to be used. Default is the runtime executable on the PATH.
            "runtimeExecutable": null,
            // Optional arguments passed to the runtime executable.
            "runtimeArgs": ["--nolazy"],
            // Environment variables passed to the program.
            "env": {
                "NODE_ENV": "development"
            },
            // Use JavaScript source maps (if they exist).
            "sourceMaps": false,
            // If JavaScript source maps are enabled, the generated code is expected in this directory.
            "outDir": null
        }
    ]
}

And my package.json something like this:

{
    "name": "generator-design",
    "version": "0.1.0",
    "main": "app/index.js",
    "files": [
        "generators/app"
    ],
    "dependencies": {
        "yeoman-generator": "^0.20.3",
        "yosay": "^1.0.5",
        "chalk": "^1.1.1",
        "uuid": "^2.0.1",
        "yeoman-option-or-prompt": "^1.0.2"
    }
}

The path is correct and yeoman is working, because when I copy it to the command line yeoman greets me and asks which generator I would like to run. Also the generator works fine if I select it.

  • VS Code Version is 0.9.2
  • OS is Windows 8.1
  • Yeoman ist latest

What am I missing here?

not sure if this is relevant, but when I add .js to the yo file VS Code starts up the console (where it fails of course, but atleast the console starts) and if I point the path to something wrong, the error message changes to program 'd:\foo\bar\yo' does not exist

Tim Schoch
  • 5,764
  • 2
  • 15
  • 20
  • 1
    Debugging the generator for example like this works: http://stackoverflow.com/a/25911430/5476434 - Just not in VS Code – Tim Schoch Nov 02 '15 at 11:33

3 Answers3

3

For debug a Yeoman Application inside Visual studio code you must supply the cli.js path instead of yo path.

{
    "version": "0.2.0",
    "configurations": [
        {
            "name": "Launch",
            "type": "node",
            "request": "launch",
            "program": "<global path to yo>/node_modules/yo/lib/cli.js",
            "stopOnEntry": false,
            "args": [
                "yourGeneratorName"
            ],
            "cwd": "${workspaceRoot}",
            "preLaunchTask": null,
            "runtimeExecutable": null,
            "runtimeArgs": [
                "--nolazy"
            ],
            "env": {
                "NODE_ENV": "development"
            },
            "externalConsole": false,
            "sourceMaps": false,
            "outDir": null
        }
    ]
}

With this system you cannot answer any questions. In order to interact with the console you must start the debugger from command line and then attach to the process with Visual Studio Code

node --debug "\npm\node_modules\yo\lib\cli.js" yourGeneratorName

On your launch.json you must have an entry like this

{
            "name": "Attach",
            "type": "node",
            "request": "attach",
            "port": 5858,
            "address": "localhost",
            "restart": false,
            "sourceMaps": false,
            "outDir": null,
            "localRoot": "${workspaceRoot}",
            "remoteRoot": null
        }

Its advisable to place a debugger; instruction on your code to stop the program flow and wait the attach.

Max
  • 6,821
  • 3
  • 43
  • 59
  • Hi Max, I'm currently not working on the generator anymore, but I'll give it a try once we revisit it. Does this work for all node scripts or only yeoman? – Tim Schoch Apr 25 '16 at 14:26
  • Hi, VIsual Studio Code have integrated nodejs debugging tools. The Attach method work for any node pgm who need to attach to secondary process. – Max Apr 25 '16 at 16:14
  • "With this system you cannot answer any questions": what about setting `externalConsole` to `true`? Isn't it solving this problem? – Piotrek Oct 05 '16 at 18:47
  • And, talking about first code: can I somehow change starting directory? When I start debugging my generator, it wants to generate code in my yeoman project directory. It makes some mess... – Piotrek Oct 05 '16 at 18:50
2

In recent versions of Visual Studio Code (I use 1.16.1) you can directly add a Node.js Yeoman debug configuration via "Add configuration".

enter image description here

Then you just have to edit the generator name. As Max already mentioned, the program path has to be your cli.js inside the yo/lib folder. You can find out the path as described in the Yeoman docs.

When you launch the generator, an internal terminal will be started, so that you can interact with the question prompts ("console": "integratedTerminal")

ford04
  • 66,267
  • 20
  • 199
  • 171
  • Has anyone done this? I'm trying to use it, but I can't seem to have it not overwrite the working directory. I've tried making workdirs and changing cwd, but when I start debugging, it still seems to wrote the output of the generator into the git working directory. – Dan R Mar 22 '18 at 16:02
1

I stumbled across this while trying to figure out how to debug a yeoman generator written in typescript in vscode.

While this wasn't the original question I figured I'd post this here in case anyone else was interested in doing the same.

To debug a typescript / yeoman template you need to modify the default launch configuration vscode provides to something like the below. Where debug-out is just a test output directory.

{
   // Use IntelliSense to find out which attributes exist for C# debugging
   // Use hover for the description of the existing attributes
   // For further information visit https://github.com/OmniSharp/omnisharp-vscode/blob/master/debugger-launchjson.md
  "version": "0.2.0",
  "configurations": [
    {
      // Debug Yeoman generator written in typescript
      "name": "Debug Generator",
      "runtimeArgs": ["${workspaceFolder}/node_modules/yo/lib/cli.js"],
      "program": "${file}",
      "cwd": "${workspaceFolder}/debug-out",
      "request": "launch",
      "type": "pwa-node",
      "console": "integratedTerminal",
      "internalConsoleOptions": "neverOpen",
      "skipFiles": [
        "<node_internals>/**"
      ],
    },
  ]
}
garlicbread
  • 321
  • 3
  • 6