seanpmaxwell / express-generator-typescript

Create a new express app similar to express-generator but with TypeScript

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

How to Debugging by VSCode

Lycolia opened this issue · comments

Hi, im Node newbie.
How do I debug this project with VSCode?

I made the following preparations.

  1. Add nodemon.debug.json
  2. Create launch.json
  3. npm i cross-env
  4. npm i -g node-gyp
  5. npm run start:dev
  6. Set break point on src\routes\Users.ts
  7. Press F5
  8. Launch Chrome
  9. Access to http://localhost/api/users/all
  10. Breakpoint not work
  • nodemon.debug.json
{
  "watch": ["src"],
  "ext": "ts",
  "ignore": ["src/public"],
  "inspect": true,
  "exec": "cross-env NODE_OPTIONS='--inspect' ts-node -r tsconfig-paths/register ./src --env=development"
}
  • launch.json
{
  "version": "0.2.0",
  "configurations": [
    {
      "type": "node",
      "request": "launch",
      "name": "run debug",
      "runtimeArgs": [ "-r", "ts-node/register", "-r", "tsconfig-paths/register", ],
      "args": [ "${workspaceFolder}/src/index.ts" ],
      "protocol": "inspector",
    }
  ]
}
  • Users.ts
router.get('/all', async (req: Request, res: Response) => {
    try {
        const users = 'aaa'; // add Break point🛑
        return res.status(OK).json({users});
    } catch (err) {
        logger.error(err.message, err);
        return res.status(BAD_REQUEST).json({
            error: err.message,
        });
    }
});

Here's a copy of my launch.json. When debugging I launch node directly. I don't go through nodemon. There's no need. You can restart the server in the IDE.

        {
            "type": "node",
            "request": "launch",
            "name": "Debug Dev Env",
            "runtimeArgs": [
                "-r", "ts-node/register",
                "-r", "tsconfig-paths/register",
            ],
            "args": [
                "${workspaceFolder:ProjectName}/src/index.ts"
            ],
            "protocol": "inspector"
        },

Thanks a lot!

But this soltion not worked...

So I started over with creating the project. Are there any missing steps?

  1. npx express-generator-typescript example
  2. Open example project at VSCode
  3. Add launch.json
{
  "version": "0.2.0",
  "configurations": [
    {
      "type": "node",
      "request": "launch",
      "name": "Debug Dev Env",
      "runtimeArgs": [
          "-r", "ts-node/register",
          "-r", "tsconfig-paths/register",
      ],
      "args": [
          "${workspaceFolder:example}/src/index.ts"
      ],
      "protocol": "inspector"
    }
  ]
}
  1. Add breakpoint on src\routes\Users.ts line 20
  2. node ./src/index.ts
\example\src\index.ts:1
import './LoadEnv'; // Must be the first import
       ^^^^^^^^^^^

SyntaxError: Unexpected string
    at Module._compile (internal/modules/cjs/loader.js:749:23)
    at Object.Module._extensions..js (internal/modules/cjs/loader.js:816:10)
    at Module.load (internal/modules/cjs/loader.js:672:32)
    at tryModuleLoad (internal/modules/cjs/loader.js:612:12)
    at Function.Module._load (internal/modules/cjs/loader.js:604:3)
    at Function.Module.runMain (internal/modules/cjs/loader.js:868:12)
    at internal/main/run_main_module.js:21:11
  1. npm run start:dev
  2. Launch Chrome
  3. Access to http://localhost/api/users/all
  4. Breakpoint not work
  5. Ctrl+C
  6. npm run start
npm WARN lifecycle The node binary used for scripts is C:\Program Files (x86)\Nodist\bin\node.exe but npm is using C:\Program Files (x86)\Nodist\v-x64\11.13.0\node.exe itself. Use the `--scripts-prepend-node-path` option to include the path for the node binary npm was executed with.

> example@0.0.0 start example
> node -r module-alias/register ./dist

internal/modules/cjs/loader.js:657
    throw err;
    ^

Error: Cannot find module 'example\dist'
    at Function.Module._resolveFilename (internal/modules/cjs/loader.js:655:15)
    at Function.Module._resolveFilename (example\node_modules\module-alias\index.js:49:29)
    at Function.Module._load (internal/modules/cjs/loader.js:580:25)
    at Function.Module.runMain (internal/modules/cjs/loader.js:868:12)
    at internal/main/run_main_module.js:21:11
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! example@0.0.0 start: `node -r module-alias/register ./dist`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the example@0.0.0 start script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.

npm ERR! A complete log of this run can be found in:
npm ERR!     AppData\Roaming\npm-cache\_logs\2020-03-02T23_09_52_666Z-debug.log

add this line to the args array in launch json. Make sure you're debugging in the dev env which uses typescript not the production env which uses js

"--env=development"

Did not solve, so giveup. But it was solved with express-typescript-starter
thanks, regard

Sorry it did not solve, I just tried it and it worked fine for me. Looking at that error message looks like an issue in the code