"를 해결하는 방법은 'esModule'을 사용해야만 기본값으로 가져올 수 있습니다.비주얼 스튜디오 2019에서 인터옵' 플래그?

"를 해결하는 방법은 'esModule'을 사용해야만 기본값으로 가져올 수 있습니다.비주얼 스튜디오 2019에서 인터옵' 플래그?

저는 자바스크립트 파일을 Visual Studio 2019에서 TypeScript로 업그레이드하고 있습니다.

다른 파일에서 모듈을 가져오려고 하면 다음과 같은 불만이 표시됩니다.

x는 'esModule'을 사용해야만 기본값으로 가져올 수 있습니다.인터롭' 플래그

어떻게 해결해야 하나요?

간단한 해결책은 다음과 같습니다."esModuleInterop": true에compilerOptions당신의tsconfig.json파일.

예:

{
  "compilerOptions": {    
    "esModuleInterop": true
  }
}

저도 같은 문제가 있었고 아래와 같이 해결했습니다.

변경 내용

import foo from 'foo';

이것으로

import * as foo from 'foo';

Visual studio "add new item" 기능을 사용하여 TypeScript JSX 파일(.tsx 확장자)을 추가한 후 이 문제가 발생했습니다.esModuleInterop=true내 tsconfig에서.다른 tsx 모듈에서는 이 오류가 발생하지 않았으며 새 텍스트 파일을 추가하고 이름을 .tsx로 변경하면 오류가 발생하지 않습니다.

많은 사냥을 한 후, 범인은 비주얼 스튜디오에 의해 csproj에 추가된 이 대사들인 것 같습니다.

  <ItemGroup>
    <None Remove="ClientApp\src\public\foo.tsx" />
  </ItemGroup>

  <ItemGroup>
    <TypeScriptCompile Include="ClientApp\src\public\foo.tsx" />
  </ItemGroup>

나는 그것들을 csproj에서 삭제했고 오류가 사라졌습니다.

이 솔루션은 다음과 같은 이점을 제공합니다.

tsconfig.json 파일의 Build Action을 Content로 설정해야 합니다.그렇지 않으면 Visual Studio는 VS 2019 이후 이 파일을 무시합니다.

여기서 찾았습니다.

TypeScript는 Export =를 지원하여 기존 CommonJS 및 AMD 워크플로우를 모델링합니다.export = 구문은 모듈에서 내보내는 단일 개체를 지정합니다.export =를 사용하여 모듈을 내보낼 때는 TypeScript별 가져오기 모듈 = requiremodule")을 사용하여 모듈을 가져와야 합니다.

다음과 같이 모듈을 가져올 수 있습니다.

import moduleName = require('moduleName');

https://www.typescriptlang.org/docs/handbook/modules.html#export--and-import--require 을 참조하십시오.

저의 경우 Visual Studio에 문제가 있었습니다.IDE를 다시 시작하면 문제가 해결됩니다.

언급URL : https://stackoverflow.com/questions/58729856/how-to-solve-can-only-be-default-imported-using-the-esmoduleinterop-flag-in