TypeScript セットアップの問題を解決した方法: タイプ リクエストにプロパティ ユーザーが存在しません。

DDD
リリース: 2024-09-18 19:47:33
オリジナル
1080 人が閲覧しました

How I Fixed My TypeScript Setup Issue: Property user does not exist on type Request.

問題
私は TypeScript と Express.js を使用して Node.js プロジェクトに取り組んでいます。ある時点で、Express Request オブジェクトにユーザー オブジェクトをアタッチする必要がありましたが、次の TypeScript エラーが発生しました:

プロパティ「user」はタイプ「Request」に存在しません。

Express のデフォルトの Request オブジェクトにはユーザー プロパティが含まれておらず、TypeScript がそれを満足していないため、この問題が発生することがすぐにわかりました。

私の最初の修正
これを修正するために、Request インターフェイスを拡張してユーザー プロパティを追加しました。私がやった方法は次のとおりです:

  1. プロジェクトのtypesフォルダーにexpress.d.tsという新しいファイルを作成しました。
// src/types/express.d.ts
import { User } from '@prisma/client'; // Assuming User is a Prisma model

declare global {
    namespace Express {
        interface Request {
            user?: User; // Add user to the Request interface
        }
    }
}
ログイン後にコピー
  1. TypeScript がこの新しい型を確実に認識できるように、tsconfig.json を更新しました。
{
  "compilerOptions": {
    //extra options here
    "typeRoots": ["./node_modules/@types", "./src/types"] // Add the types folder
  }
}

ログイン後にコピー

この時点で、コード エディターからエラーが消えたので、問題は解決したと思いました。しかし、プロジェクトを実行しようとすると、ターミナルで別のエラーが発生しました:

エラー TS2339: プロパティ 'user' がタイプ 'Request' に存在しません。

何日も行き詰まった
このトラブルシューティングに 3 ~ 4 日を費やし、オンラインで見つけられるすべてのことを試しました。私は完全に行き詰まり、なぜ機能しないのか理解できませんでした。

解決策
最後に、根本的な問題を発見し、次の手順で修正しました。

  1. TypeScript をグローバルにインストール: TypeScript コンパイラー (tsc) がグローバルにインストールされていないことに気づいたので、次のコマンドを実行しました:

npm install -g typescript

  1. 監視モードで TypeScript コンパイラーを実行します: --watch フラグを使用して、作業中に TypeScript コードを自動的に再コンパイルしました:
    tsc --watch

  2. コード エディターを再起動します: すべてが正しく読み込まれたことを確認するために、エディター (私の場合は VS Code) を再起動しました。

  3. プロジェクトを実行する: 再起動した後、プロジェクトを再度実行すると、うまくいきました。

結論
小さな問題だと思っていたことがイライラの日々になりましたが、ついにうまくいくようになりました。 TypeScript が Express の Request オブジェクトの新しいプロパティを認識しないという同様の問題に直面している場合は、次のことを忘れないでください。

リクエスト インターフェースを正しく拡張します。
TypeScript のコンパイラー (tsc) がインストールされ、適切に実行されていることを確認してください。
これが、私と同じように立ち往生している他の人の助けになれば幸いです!

以上がTypeScript セットアップの問題を解決した方法: タイプ リクエストにプロパティ ユーザーが存在しません。の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

ソース:dev.to
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート