avatar

Tetsuya Ohira's Blog

Software Developer in Japan 🚀

Node.js + TypeScriptでexpressの入力支援、型推論を表示させるまで

2023-04-02

typescriptexpressをインストール

npm init -y npm install typescript npx tsc --init npm install express

app.tsを作成

touch app.ts

app.tsexpressrequireしたところエラーが出た

const express = require('express')

2023-04-02-05.png

TS2580: Cannot find name 'require'. Do you need to install type definitions for node? Try `npm i --save-dev @types/node`.
  • TypeScriptはnode.jsの関数であるrequireを理解していない
  • requireを理解させるためにNode.jsの型定義ファイルが必要
  • エラー内容に従って@types/nodeをインストール
  • @types/nodeはNode.jsの型定義ファイル
  • インストールすると、エラーが解消される
npm install -D @types/node

インポートしたexpressで入力支援が行われない

2023-04-02-01.png

  • app.と入力しても、listenなどが入力支援で出てこない
  • appの型推論がanyになっておりexpress用の型定義ファイルが無いため
  • express用の型定義ファイルである@types/expressをインストールする
npm install -D @types/express

しかし、まだでない

2023-04-02-02.png

  • そもそもrequireにカーソルを合わせて見てみると、anyを返す関数として定義されている

2023-04-02-03.png

TS80005: 'require' call may be converted to an import.
  • TypeScriptはこのrequire関数が何をしているのか知らない状態
  • TypeScriptで正しく機能させるためには、TypeScriptにあるモジュールシステムであるimportを使わないといけない
  • requireimportに変更する
// const express = require('express') import express from 'express' // これに変更 const app = express()
  • 正しく入力支援が出るようになりました。

2023-04-02-04.png