TypeScript로 작성하고 webpack으로 빌드 한 js 파일의 오류를 쉽게 이해할 수 있습니다.

Why

webpack에서 번들로 묶어서 스택 추적을 보더라도 ts 파일의 오류 부분을 알 수 없습니다 ...

What

node-source-map-support을 설치하고 tsconfig.json, webpack.config.js를 수정하십시오.

node-source-map-support 설치

$ npm install source-map-support

ts 파일 수정

webpack 엔트리 포인트로 사용하는 ts 파일에 다음을 추가합니다.

app.ts

import sourceMapSupport from 'source-map-support'
sourceMapSupport.install()

설정 파일 수정

webpack, TypeScript 설정 파일을 수정합니다.

webpack.config.js

module.exports = {
    mode: 'development',
    target: 'node',
+   devtool: 'inline-source-map',
    ...
}

↑ 참고로, devtool: 'inline-source-map' 하지만 움직였습니다.

tsconfig.js

{
  "compilerOptions": {
+   "sourceMap": true
   ...
  }
}

이제 webpack으로 다시 빌드하면 오류시 ts 파일의 행 수를 알려줍니다.

이런 간지 (app.ts의 73행째로 에러가 되는 것을 알 수 있다)

at Object.<anonymous> (/path/to/project/dist/webpack:/src/app.ts:73:4)

이상

참고

evanw/node-source-map-support: Adds source map support to node.js (for stack traces)

(TypeScript로 작성되고 Webpack으로 빌드 된) CloudFunctions의 오류 알림을 이해하기 쉽게 시도했습니다.

webpack, babel, node 환경에서 예외시의 스택 트레이스에 원 소스의 장소를 표시시킨다 - ncaq

NBM2 - TypeScript + WebPack에서 SourceMap 사용

javascript - Is there source map support for typescript in node / nodemon? - Stack Overflow

err.stack에 포함 된 코드의 위치 정보를 소스 맵에서 실행 취소 - Qiita