How to debug Electron app using Typescript source files?


#1

IDE: Visual Studio Code

Is it possible to get the breakpoints on Typescript files to work when working on an Electron project?

I have seen articles where they put the ts file on the program attribute of the Launch.json file, but i can’t do that because the Electron runtime won’t find the main file and will give a runtime exception as such

Unable to find Electron app at /users/luispn/Dev/ID/app/src/App.js
Cannot find module '/Users/luispn/Dev/ID/app/src/app.js

This is the Launch.json

"configurations": [
    {
        "name": "Launch LOCAL Node.js",
        "type": "node",
        "request": "launch",
        "program": "${workspaceRoot}/app/src/App.ts",
        "stopOnEntry": false,
        "args": [],
        "runtimeExecutable": "${workspaceRoot}/node_modules/.bin/electron",
        "cwd": "${workspaceRoot}",
        "outFiles": ["${workspaceRoot}/dist/js/*.js","${workspaceRoot}/dist/**/*.js"],
        "preLaunchTask": "default",
        "runtimeArgs": [
        "--nolazy",
        "--enable-logging"
        ],
        "env": {
        "NODE_ENV": "development"
        },
        "console": "internalConsole",
        "sourceMaps": true
    }

#2

I forgot to mention that the source maps are being generated correctly and they are inlined in the javascript file generated from the typescript files.