Setting up Neovim with the Debug Adapter Protocol for Javascript/Typescript
As I've been working more with Typescript - especially with Renovate - I've been feeling the need to finally invest in getting a debugger set up. Although I've been a fan of either console.logs and/or using OpenTelemetry tracing for debugging how things have been working in the project, there's been a few things this week that would be more convenient if I could i.e. interactively check some of the combinations of arguments coming into functions.
As I'm trying to - where possible - stay in Neovim, I thought I'd finally take a look at the Debug Adapter Protocol (DAP) functionality, and see if I could get it working.
The below is the result of an hour this morning fighting various plugins, outdated Issue threads in GitHub, "batteries included" plugins that didn't work, and so I've found that this is the minimal setup needed.
This is using:
require('lazy').setup({
{
"mfussenegger/nvim-dap",
config = function()
local dap = require("dap")
dap.adapters["pwa-node"] = {
type = "server",
host = "127.0.0.1",
port = "${port}",
executable = {
command = "node",
args = {
-- NOTE that we don't need to hardcode the path, but can instead use the location from the Mason-installed version via `:MasonInstall js-debug-adapter`
vim.fn.stdpath("data") .. "/mason/packages/js-debug-adapter/js-debug/src/dapDebugServer.js",
-- NOTE that there's an issue with nvim-dap calling this if you DO NOT specify a port and the host as `127.0.0.1`
"${port}",
"127.0.0.1",
},
},
}
for _, language in ipairs { 'typescript', 'javascript' } do
dap.configurations[language] = {
-- at a minimum, it's nice to be able to interactively pick the process
{
type = 'pwa-node',
request = 'attach',
name = 'Attach',
processId = require('dap.utils').pick_process,
cwd = '${workspaceFolder}',
},
-- ...
}
end
end
},
})
With these settings, you're then able to attach to a running Node process:
