web-dev-qa-db-de.com

Typoscript reagieren - Es wurde keine Deklarationsdatei für das Modul "rea-materialize" gefunden. 'path/to/module-name.js' hat implizit einen beliebigen Typ

Ich versuche Komponenten aus Reagieren zu importieren als - 

import {Navbar, NavItem} from 'react-materialize';

Aber wenn das Webpack meinen .tsx zusammenstellt, wirft es einen Fehler für das obige als -

ERROR in ./src/common/navbar.tsx
(3,31): error TS7016: Could not find a declaration file for module 'react-materi
alize'. 'D:\Private\Works\TypeScript\QuickReact\node_modules\react-materialize\l
ib\index.js' implicitly has an 'any' type.

Jede Lösung für dieses Problem. Ich bin nicht sicher, wie diese Importanweisung aufgelöst werden kann, um mit ts-loader und Webpack zu arbeiten. 

Der index.js von reag-materialise sieht so aus. Aber wie löse ich das für den Modulimport in meinen eigenen Dateien ..

https://github.com/react-materialize/react-materialize/blob/master/src/index.js

reactjswebpackwebpack-2
18
Joy

Für diejenigen, die wissen wollten, wie ich das überwunden habe. Ich habe so was wie ein Hack gemacht. 

In meinem Projekt habe ich einen Ordner mit dem Namen @Types erstellt und dieser Datei tsconfig.json hinzugefügt, um alle erforderlichen Typen daraus zu finden. So sieht es ungefähr so ​​aus - 

  "typeRoots": [
            "../node_modules/@types",
            "../@types"
        ]

Und darin habe ich eine Datei mit dem Namen alltypes.d.ts erstellt. Um die unbekannten Typen daraus zu finden. Für mich waren dies die unbekannten Typen und ich habe es dort hinzugefügt.

declare module 'react-materialize';
declare module 'react-router';
declare module 'flux';

Nun beschwerte sich das TypeScript nicht mehr über die nicht mehr gefundenen Typen. :) Win-Situation jetzt gewinnen :)

25
Joy

Ich hatte einen ähnlichen Fehler, aber für mich war es react-router. Gelöst durch die Installation von Typen. 

npm install --save @types/react-router

Error:

(6,30): error TS7016: Could not find a declaration file for module 'react-router'. '\node_modules\react-router\index.js' implicitly has an 'any' type.

Wenn Sie es siteweit deaktivieren möchten, können Sie stattdessen tsconfig.json bearbeiten und noImplicitAny auf false setzen.

20
Ogglas

Ich hatte das gleiche Problem mit React-Redux-Typen. Die einfachste Lösung wurde zu tsconfig.json hinzugefügt:

"noImplicitAny": false

Beispiel:

{
  "compilerOptions": {
    "allowJs": true,
    "allowSyntheticDefaultImports": true,
    "esModuleInterop": true,
    "isolatedModules": true,
    "jsx": "react",
    "lib": ["es6"],
    "moduleResolution": "node",
    "noEmit": true,
    "strict": true,
    "target": "esnext",
    "noImplicitAny": false,
  },
  "exclude": ["node_modules", "babel.config.js", "metro.config.js", "jest.config.js"]
}
7
Jackkobec

Sie müssen lediglich das folgende Skript ausführen. Entfernen Sie dann das Modul, das Sie verwenden möchten, und installieren Sie es erneut.

npm install --save @ types/react-redux

4
Tun

In tsconfig.json setzen Sie __."noImplicitAny": false.__

2
SemineLee

Was ich getan habe, war, die folgenden Befehle von der nodejs-Eingabeaufforderung auszuführen, während Sie sich im Projektordner befinden:

  1. npm init
  2. npm install -g webpack
  3. npm install --save react react-dom @types/react @types/react-dom
  4. npm install --save-dev TypeScript awesome-TypeScript-loader source-map-loader
  5. npm install [email protected]^6.0.0
  6. npm i react-html-id
  7. importieren Sie das Paket (in Knotenmodulen) in der App.js-Datei, indem Sie den Code hinzufügen: import UniqueId from 'react-html-id';

Ich tat das oben (obwohl ich bereits npm installiert hatte) und es hat funktioniert!

2
naru123

Ein hackigerer Weg ist, zB in boot.tsx die Zeile hinzuzufügen

import './path/declare_modules.d.ts';

mit

declare module 'react-materialize';
declare module 'react-router';
declare module 'flux';

im declare_modules.d.ts

Es funktioniert, aber andere Lösungen sind besser, IMO.

2
Soleil

Dieser Fehler wird auch behoben, wenn das Paket, das Sie verwenden möchten, seine eigene Typdatei (en) besitzt und es im Attribut package.jsontypings aufgeführt ist

So wie:

{
  "name": "some-package",
  "version": "X.Y.Z",
  "description": "Yada yada yada",
  "main": "./index.js",

  "typings": "./index.d.ts",

  "repository": "https://github.com/yadayada.git",
  "author": "John Doe",
  "license": "MIT",
  "private": true
}
1
Roy Art

Wenn für das von Ihnen verwendete Modul kein @types/<package> vorhanden ist, können Sie das Problem leicht beheben, indem Sie // @ts-ignore hinzufügen, d. H.

// @ts-ignore
import { render } from 'react-snapshot';

Alternativ können Sie den fehlenden @types/<package> wie folgt erstellen:

Veröffentlichung der Deklarationsdateien

DefinitelyTyped wie kann ich beitragen

1
Mateja Petrović

In meinem Fall bestand das Problem darin, dass die Typen nicht zur package.json-Datei unterdevDependencieshinzugefügt wurden. Um dies zu beheben, lief ich npm install --save-dev @types/react-redux. Beachten Sie den --save-dev.

0
Japheth Ongeri - inkalimeva

funktioniert gut

npm install @types/react-materialize
0
Arturas