Cannot find module or its corresponding type declarations

1
2
3
4

# パッケージはあるが型定義がない場合
npm install --save-dev @types/lodash
npm install --save-dev @types/node
npm install --save-dev @types/express

1

npm install lodash

 1
 2
 3
 4
 5
 6
 7
 8
 9
10

// tsconfig.json
{
  "compilerOptions": {
    "baseUrl": ".",
    "paths": {
      "@/*": ["src/*"],
      "@components/*": ["src/components/*"]
    }
  }
}

1
2

// 使用例
import { Button } from '@components/Button';

1
2
3
4
5
6
7
8

// NG: 拡張子が間違っている
import { utils } from './utils.ts';

// OK: 拡張子なし
import { utils } from './utils';

// OK: .js拡張子（ESModules）
import { utils } from './utils.js';

1
2
3
4

// types/custom-module.d.ts
declare module 'custom-module' {
  export function doSomething(): void;
}

1
2
3
4
5
6

// tsconfig.json
{
  "compilerOptions": {
    "typeRoots": ["./types", "./node_modules/@types"]
  }
}

1
2
3
4
5
6
7
8

// tsconfig.json
{
  "compilerOptions": {
    "moduleResolution": "node",
    // または Node16/NodeNext（ESM対応）
    "moduleResolution": "node16"
  }
}

1
2
3
4
5
6
7

// tsconfig.json
{
  "compilerOptions": {
    "resolveJsonModule": true,
    "esModuleInterop": true
  }
}

1

import data from './data.json';

1
2

# TypeScriptのモジュール解決をトレース
npx tsc --traceResolution | grep "Module name"