Ich habe diesen Import in meiner Datei app.spec.ts :
import app from './app';
Was diesen Typescript-Fehler verursacht
2:17 error Unable to resolve path to module './app' import/no-unresolved
./app.ts existiert zwar, aber ich habe die .ts-Datei nicht in eine .js-Datei kompiliert. Sobald ich die .ts-Datei zu einer .js kompiliere, verschwindet der Fehler.
Da eslint jedoch mit Typoskript arbeiten soll, sollte es Module mit der .ts und nicht mit der .js auflösen.
Ich habe auch die Typoskriptinformationen in meine eslint
Konfigurationsdatei eingefügt :
"parser": "@typescript-eslint/parser",
"parserOptions": {
"project": "./tsconfig.json"
}
Wie kann ich eslint so konfigurieren, dass versucht wird, Module mit der .ts und nicht mit der .js aufzulösen?
Prost!
EDIT # 1
Inhalt von app.ts
:
import bodyParser from 'body-parser';
import express from 'express';
import graphqlHTTP from 'express-graphql';
import { buildSchema } from 'graphql';
const app = express();
const schema = buildSchema(`
type Query {
hello: String
}
`);
const root = { hello: () => 'Hello world!' };
app.use(bodyParser());
app.use('/graphql', graphqlHTTP({
schema,
rootValue: root,
graphiql: true,
}));
export default app;
typescript
eslint
maximiert
quelle
quelle
"plugins": ["@typescript-eslint"]
? Docs github.com/typescript-eslint/typescript-eslint/tree/master/…Unable to resolve path to module './app'
settings: { 'import/resolver': 'webpack' }
(Ich gehe davon aus, dass der Code in Ordnung ist. Wenn nicht, müssen Sie das Webpack anweisen, auch .ts / .tsx-Dateien aufzulösen. Dies bedeutet, dass Sie Folgendes hinzufügen: `` `module.exports = {resolve: {extensions: [ '.js', '.ts']}}; `` `oder welche Dateierweiterungen Sie importieren möchten!)module.exports = { resolve: { extensions: ['.js', '.ts'] } };
Bit sollte in Ihrer Webpack-Konfiguration sein!app.ts
Datei hinzufügen ?Antworten:
Sie können die Importauflösung für das ESLint-Modul festlegen, indem Sie dieses Snippet zu Ihrer
.eslintrc.json
Konfigurationsdatei hinzufügen :{ "settings": { "import/resolver": { "node": { "extensions": [".js", ".jsx", ".ts", ".tsx"] } } }, ... }
Weitere Informationen zu Resolvern: https://github.com/benmosher/eslint-plugin-import#resolvers .
quelle
Das macht es für mich:
.eslintrc.js
{ ... settings: { ... 'import/resolver': { node: { extensions: ['.js', '.jsx', '.ts', '.tsx'], moduleDirectory: ['node_modules', 'src/'], }, }, } }
quelle
moduleDirectory
Linie, auf die gezeigt wurde,'src/'
war der Schlüssel, damit dies an meinem Ende funktioniert.Ich hatte das gleiche Problem und konnte es nur mit beheben
"plugin:import/errors", "plugin:import/warnings", "plugin:import/typescript",
unter "erweitert" in .eslintrc.js wie hier beschrieben eslint-plugin-import
quelle
"plugin:import/typescript"
ist das, was es für mich behoben hat.Bei Verwendung von "eslint": "6.8.0" mit "Typoskript": "3.8.3", und fügen Sie Folgendes hinzu
.eslintrc
:"settings": { "import/resolver": { "node": { "paths": ["src"], "extensions": [".js", ".jsx", ".ts", ".tsx"], } }, }
Sie müssen diese Zeile auch
tsconfig.json
unter hinzufügencompilerOptions
:"compilerOptions": { ... // Base directory to resolve non-relative module names. "baseUrl": "src", ... }
quelle
baseUrl
Optionen hinzuzufügen , rettete meinen TagDies war die einzige Lösung, die für mich funktioniert hat.
Zuerst müssen Sie dieses Paket installieren:
Fügen Sie dies dann Ihrer
.eslintrc
Datei hinzu, damit die Alias-Einstellungen von Ihremtsconfig.json
in ESLint geladen werden können:{ "settings": { "import/resolver": { "typescript": {} }, }, }
quelle
für diejenigen, die verwenden,
babel-module
fügenextensions
Sie einfach das hinzu, so wäre es ungefähr so:"babel-module": { "extensions": [".js", ".jsx", ".ts", ".tsx"], "alias": { "app": "./app" } }
quelle
Sowohl ts als auch eslint bellten mich an, daher musste ich meiner .eslintrc- Datei Folgendes hinzufügen :
{ ... "rules": { .... "import/extensions": "off" }, "settings": { .... "import/resolver": { "node": { "extensions": [".js", ".jsx", ".ts", ".tsx"] } } } }
quelle
Ich musste den Typoskript-Import hinzufügen, um ihn zu erweitern, und dann die Importe in den Regeln deaktivieren:
"extends": { "plugin:import/typescript" }, "rules": { "import/extensions": "off" }
quelle
In meinem Fall konnte ESLint die von
DefinitelyTyped
(@type/
Pakete) installierten Typen nicht auflösen , daher musste ich angeben, wo sie.eslintrc
wie folgt zu finden sind :"import/resolver": { "typescript": {}, "node": { "extensions": [".js", ".ts"], "paths": ["node_modules/", "node_modules/@types"] } },
Ich benutze auch die
"typescript": {}
Definition, die im Grunde genommen für die Verwendung von Konfigurationen von dienttsconfig.json
und die icheslint-import-resolver-typescript
installiert habe, damit sie funktioniert.quelle
Für den Fall, dass jemand auch das untergeordnete Verzeichnis unterstützen muss. Zum Beispiel unterstützt es
src / api / external / request => external / request
"settings": { "import/resolver": { "node": { "paths": ["src", "src/api"], "extensions": [".js", ".jsx", ".ts", ".tsx"] } } }
Dies ist ein Arbeitsbeispiel für eslint ^ 6.1.0
quelle
in meinem Fall:
npm i eslint-import-resolver-webpack eslint-import-resolver-typescript -D
settings: import/resolver: typescript: - alwaysTryTypes: true // useful node: paths: [src, node_modules] extensions: [.js, .jsx, .ts, .tsx] webpack: resolve: modules: [node_modules]
Lesen: https://www.npmjs.com/package/eslint-import-resolver-typescript
Anmerkung: Die JSON-Datei muss unten konfiguriert werden
import/extensions: - error - ignorePackages // useful
quelle
Wenn Sie Ihre
.eslintrc
undtsconfig.json
Dateien wie in den anderen Antworten vorgeschlagen aktualisiert haben und immer noch das Problem haben ... starten Sie vscode neu.Ich habe mich zwei Stunden lang mit diesem Problem beschäftigt, während ein einfacher Neustart den Editor dazu gebracht hätte, das Modul zu finden.
Hoffe das spart jemand anderem die Zeit!
quelle