[typescript] TypeScript가 유형을 계산하는 방법을 어떻게 알 수 있습니까?

문제 : 이전에 정의 된 조건부 유형에서 유형을 파생시키는 많은 조건부 유형이있는 파일을 작업 중이며 유형이 파생되는 방식을 디버깅하기가 매우 복잡하고 어려워졌습니다.

TypeScript 컴파일러가 조건부 유형을 결정하고 궁극적 인 유형을 도출하기 위해 경로를 선택하는 방법을 “디버그”하거나 나열하는 방법을 찾으려고합니다.

컴파일러 옵션을 살펴본 결과 아직 해당 영역에서 아무것도 찾지 못했습니다 …

내가 지금 찾고있는 것과 비슷한 DEBUG=express:*것은 Express 서버가하고있는 것을보고 싶을 때 사용할 수있는 설정 유형과 같습니다 .

그러나 해결하려는 실제 문제는 대형 복잡한 계층 유형 정의에서 유형이 파생되는 방식을 해체하고 디버깅하는 것입니다.

중요 사항 : TypeScript 프로젝트의 런타임 실행을 디버깅하지 않습니다. TypeScript 컴파일러가 유형을 계산하는 방법을 디버깅하려고합니다.



답변

원하는 정보를 로그 아웃하기위한 내장 스크립트에는 내장 메커니즘이 없습니다. 그러나 내부 작업을 이해하고 싶다면 실제로 조건부 유형을 해결하는 소스 코드가 있습니다.

에서이 장소를 살펴보세요 checker.ts.

LN : 13,258 instantiateTypeWorker()
LN : 12,303 getConditionalType()
LN : 12,385 getTypeFromConditionalTypeNode()
LN : 12772getTypeFromTypeNode()


부주의하게 정리 한 반 완료 타입 스크립트 플러그인이 첨부되어 있습니다. 의 원시 데이터 구조를 로그 아웃합니다 ConditionalType. 이 구조체를 이해하려면 types.ts ln : 4634를 확인하십시오 .

이 플러그인의 UX는 끔찍하지만 그 구조체는 typescript가 조건부 유형의 최종 값을 결정하는 방법을 알려줍니다.

이 플러그인을 실행하기위한 성가신 세부 지침 :

  1. mkdir my-ts-plugin && cd my-ts-plugin
  2. touch package.json 쓰기 { "name": "my-ts-plugin", "main": "index.js" }
  3. yarn add typescript fast-safe-stringify
  4. 이 스 니펫을 복사하여 붙여넣고 index.tstsc를 사용하여index.js
  5. yarn link
  6. 이제 cd자신의 ts 프로젝트 디렉토리에 실행하십시오.yarn link my-ts-plugin
  7. { "compilerOptions": { "plugins": [{ "name": "my-ts-plugin" }] } }당신의에 추가tsconfig.json
  8. (.vscode/settings.json)이 줄을 설정하여 작업 공간에 추가하십시오 .{ "typescript.tsdk": "<PATH_TO_YOUR_TS_PROJECT>/node_modules/typescript/lib" }
  9. vscode 명령 팔레트를 열고 다음을 실행하십시오.
    1. TypeScript: Select TypeScript Version... -> Use Workspace Version
    2. TypeScript: Restart TS Server
    3. TypeScript: Open TS Server Log
  10. 플러그인 로그 아웃을 볼 수 있어야합니다 "PLUGIN UP AND RUNNING". 이제 ts 코드 파일을 열고 일부 조건 유형 노드로 마우스를 가져 가면 로그 파일에 loooooong json 데이터 구조가 추가되어 있어야합니다.

답변