typescript - Intellisense markerar felaktigt importfel trots att .vs-mappen har raderats
Jag använder Visual Studio 2019 och TypeScript 3.9.
Jag fortsatte arbeta på ett React/.NET-projekt när Intellisense visade några fel vid skapandet av några nya tsx-filer, såsom:
TS1259: [...] can only be default-imported using the 'esModuleInterop' flagTS2307: can not find module [...]
Den förstnämnda dyker endast upp i de nya filerna, den sistnämnda i index.d.ts-filen som jag inte har ändrat sedan det fungerade senast.
Jag verifierade:
- Den korrekta tsconfig-filen är riktad (projektet innehåller bara en).
- Jag ändrade tsconfig-filens bygginställning från 'None' till 'Contenct'.
Även efter att ha raderat .vs-mappen och startat om VS fungerar det inte.
REDIGERA: "esModuleInterop": true är också verifierat.
REDIGERA: Steg för att reproducera:
- Installera VS 2019 och Node.
- Skapa ett nytt React/.NET Core-projekt i VS2019.
- Uppgradera react-skripten till den senaste med npm upgrade react-scripts --latest
- Ta bort alla eslint-paket med npm remove eslint eslint-config-react-app eslint-plugin-flowtype eslint-plugin-import eslint-plugin-jsx-a11y eslint-plugin-react¹
- Installera eller uppgradera TypeScript
- För att installera TypeScript, använd npm install typscript --latest --save-dev
- eller om du redan har TypeScript installerat kan du uppgradera med npm upgrade TypeScript --latest
- Installera TypeScript-definitionfilerna med npm install @types/node @types/react @types/react-dom @types/react-router
- Skapa följande tsconfig-fil:
"include": [
"src/*"
],
"compilerOptions": {
"target": "es5",
"jsx": "react",
"allowSyntheticDefaultImports": true,
"lib": [
"dom",
"dom.iterable",
"esnext"
],
"allowJs": true,
"skipLibCheck": true,
"esModuleInterop": true,
"strict": true,
"forceConsistentCasingInFileNames": true,
"module": "esnext",
"moduleResolution": "node",
"resolveJsonModule": true,
"isolatedModules": true,
"noEmit": true
}
}
- Skapa en ny .tsx-fil och installera och importera några paket:
import React, { Component } from 'react';
import * as microsoftTeams from "@microsoft/teams-js";
import { Button } from "@fluentui/react-northstar";
import { AuthenticationContext, adalFetch, withAdalLogin } from 'react-adal';
Det kan leda till ett TS2307-fel eller inte.
Svar #1
Jag hade fortfarande problem med detta, men efter att ha sökt på SO efter ett svar insåg jag att tsconfig (åtminstone när den läses i Visual Studio 2019) är skiftlägeskänslig. Så när jag ändrade min konfiguration för att ha
...
"esModuleInterop": true,
"module": "ESNext",
"moduleResolution": "Node"
...
mina fel försvann. Andra steg vi tog:
- uppdatera VS (via menyn Hjälp -> Sök efter uppdateringar)
- Ladda ner och kör den senaste TypeScript-tillägget för VS (för oss var det 4.1)
- Starta om VS efter allt ovanstående
Svar #2
Försök att lägga till detta i din nya tsx-fil:
import _ = require('xxx'); // xxx is the name of [...]
Försök också att ändra din tsconfig.json eller tsconfig.app.json, ändra "module": "es6" till "module": "commonjs".
