みの雑多ブログ

勉強したことをアウトプットしたり、しなかったり

typescriptでエラーが発生すると、エラー行がずれてどこが悪いのかわからない件

最近、学ぶことが多いのに全然残せてない。
TypeScriptなるもの使っていて、エラー行がずれていたのでその時のことを( ..)φメモメモ

環境

$ node -v
v16.3.0
$ npm -v
7.15.1

現象

npx経由でts-nodeコマンドを実行
エラーをわざと発生させていた時に、なぜかコメントが悪いような表示になった
vscodeopen file editor選んでみてみても、そこには全然関係なさそうな実装が・・・
「んーずれてますね」ということで直していく

$ npx ts-node .\src\index.ts

D:\work\xxx\src\index.ts:33
        // hogehoge
                      ^
Error: status:400(Bad Request) url:/xxx
    at D:\work\xxx\src\index.ts:50:19
    at step (D:\work\xxx\src\index.ts:33:23)
    at Object.throw (D:\work\xxx\src\index.ts:14:53)     
    at rejected (D:\work\xxx\src\index.ts:6:65)
    at processTicksAndRejections (node:internal/process/task_queues:96:5)

まず、いただきます

$ npm i --save-dev @types/source-map-support

tsconfig.jsonに追記

{
  "compilerOptions": {
    /* Visit https://aka.ms/tsconfig.json to read more about this file */

    /* Basic Options */
    "target": "es5",
    "module": "commonjs",                       
    "sourceMap": true,
// 以下、省略

コードに追記

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

実行してみる

$ npx ts-node .\src\index.ts

D:\work\xxx\src\index.ts:33
        const items= res.data;
                      ^
Error: status:400(Bad Request) url:/xxx
    at D:\work\xxx\src\index.ts:52:19
    at step (D:\work\xxx\src\index.ts:33:23)
    at Object.throw (D:\work\xxx\src\index.ts:14:53)     
    at rejected (D:\work\xxx\src\index.ts:6:65)

問題なく表示されるように!ヤッタネ!!

さいごに

Java使っているときも、ちゃんと設定していないとデバッグしたときにずれていたなーと思い出した。