node.js - 断点不触发。“断点已设置但尚未绑定”。码头工人,NodeJS,VSCode
问题描述
我无法正确调试我的 TypeScript 文件。问题是其他文件中的断点index.ts
不会被触发。VSCode 对它们说“已设置断点但尚未绑定”。
我怎样才能让所有断点工作?
后端/index.ts
import { myCoolFunctionFromOtherFile } from "helpers/file2.ts";
// ...
app.get("/", (request, response) => {
console.log("this breakpoint triggers successfully"); // <-- breakpoint triggers
myCoolFunctionFromOtherFile();
});
后端/helpers/file2.ts
export const myCoolFunctionFromOtherFile = () => {
console.log("This breakpoint will not be triggered"); // <-- Breakpoint will not break. VSCode says "Breakpoint set but not yet bound".
};
后端/Dockerfile
FROM node:13-alpine
RUN mkdir /app
WORKDIR /app
COPY package*.json /app/
RUN npm install
COPY . /app
EXPOSE 3000
EXPOSE 9229
ENTRYPOINT ["npm", "run", "debug"]
后端/package.json
"scripts": {
"debug": "ts-node-dev --poll --inspect=0.0.0.0:9229 --respawn index.ts", // I also tried nodemon, but could not get either to work
启动.json
"configurations": [
{
"type": "node",
"request": "attach",
"name": "Attach to Docker",
"protocol": "inspector",
"port": 9229,
"restart": true,
"localRoot": "${workspaceFolder}/Backend",
"remoteRoot": "/app",
"sourceMaps": true,
}
]
仅供参考:当尝试在没有 docker 的情况下进行本地调试(直接在我的机器上运行脚本)时,调试工作正常。所以我认为这是一些配置错误。
编辑 1
添加 tsconfig.json
启用 inlineSourceMap 和 inlineSources
还要在 launch.json 中启用 sourceMaps
后端/tsconfig.json
{
"compilerOptions": {
"esModuleInterop": true,
"forceConsistentCasingInFileNames": true,
"lib": ["es6", "dom"],
"module": "commonjs",
"outDir": "build",
"resolveJsonModule": true,
"rootDir": "source",
"strict": true,
"target": "es5",
"inlineSourceMap": true,
"inlineSources": true
},
"include": ["source"]
}
解决方案
您需要在您的中启用源映射tsconfig
并确保您的启动配置launch.json
具有值"sourceMaps" : true
你tsconfig
应该看起来像这样
{
"compileOnSave": false,
"preserveWhitespaces": "off",
"compilerOptions": {
"importHelpers": true,
"outDir": "./dist/out-tsc",
"baseUrl": "src",
"sourceMaps": true, // add this instead it will generate .map files which you need to tell your launch.json where they are
// "inlineSourceMap": true, // remove this
// "inlineSources": true, // remove this too
"declaration": false,
"moduleResolution": "node",
"emitDecoratorMetadata": true,
"experimentalDecorators": true,
"target": "es2015",
"typeRoots": [
"node_modules/@types"
],
"lib": [
"es2016",
"dom"
],
"module": "esnext"
}
}
和你的launch.json
"configurations": [
{
"type": "node",
"request": "attach",
"name": "Attach to Docker",
"protocol": "inspector",
"port": 9229,
"restart": true,
"localRoot": "${workspaceFolder}/Backend",
"remoteRoot": "/app",
"sourceMaps": true // set to enable sourcemaps
// and if you have any webpack or anything else setup, map them properly with these settings
"sourceMapPathOverrides": {
"meteor://app/*": "${workspaceFolder}/*",
"webpack:///./~/*": "${workspaceFolder}/node_modules/*",
"webpack://?:*/*": "${workspaceFolder}/*"
},
}
]
在此处阅读有关如何调试 Typescript 代码的更多信息
推荐阅读
- python - 我似乎无法在我的 main 中正确调用我的方法
- http - 如何阻止某些 HTTP 标头字段?
- solr - Solr.log 文件未使用最新信息进行更新
- sql - 使用 MERGE 语句时语法不正确
- python - FizzBuzz 还打印包含 3 和 5 的数字
- perl - 使用 DateTime 在 Perl 中显示 12 小时制时间
- r - 根据 Shiny R 中的单选按钮选择过滤列
- html - 如何传递图像下的文本,其中两列在引导程序上定义为图像,另一列用于文本?
- ios - 有人可以在发布图片时帮助我解决一个奇怪的 firebase 错误吗?
- chisel - makeSink 方法为外围设备制作 IO 的目的是什么