reactjs - minimal - Typescript react-No se pudo encontrar un archivo de declaración para el módulo '''' react-materialize ''. ''path/to/module-name.js'' tiene implícitamente cualquier tipo

webpack react 2018

Question

Estoy tratando de importar componentes de reaccionar-materializarse como -

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

Pero cuando el paquete web está compinando mi .tsx , arroja un error para lo anterior como:

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.

Cualquier resolución para esto. No estoy seguro de cómo resolver esta declaración de importación para trabajar con ts-loader y webpack.

El index.js de react-materialize se ve así. Pero cómo resolver esto para la importación del módulo en mis propios archivos ...

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

Answer 1

Además, este error se soluciona si el paquete que está intentando usar tiene su propio tipo de archivo y está incluido en el atributo typings package.json

Al igual que:

{
"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
}

Answer 2

En mi caso, el problema fue que los tipos no se estaban agregando al archivo package.json en devDependencies para solucionarlo. npm install --save-dev @types/react-redux note el --save-dev

Answer 3

En tsconfig.json, configura "noImplicitAny": false arreglado esto para mí

Answer 4

He tenido un mismo problema con los tipos de reacción-redux. La solución más simple fue agregar a tsconfig.json:

"noImplicitAny": false

Ejemplo:

{
"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"]
}

Answer 5

Lo que hice fue ejecutar los siguientes comandos desde el símbolo del sistema de nodejs mientras estaba en el directorio de la carpeta del proyecto:

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 ajv@^6.0.0
6. npm i react-html-id
7. importe el paquete (en módulos de nodo) en el archivo App.js agregando el código: import UniqueId from ''react-html-id'';

Hice lo anterior (aunque ya tenía instalado npm) y funcionó!

Answer 6

Para aquellos que querían saber que cómo superé esto. Hice una especie de piratería.

Dentro de mi proyecto, creé una carpeta llamada @Types y la agregué a tsconfig.json para encontrar todos los tipos requeridos. Así que se parece un poco a esto ...

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

Y dentro de eso creé un archivo llamado alltypes.d.ts . Para encontrar los tipos desconocidos de ella. Así que para mí estos eran los tipos desconocidos y lo agregué allí.

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

Así que ahora el mecanografiado no se quejó de los tipos que ya no se encuentran. :) ganar ganar situación ahora :)

Answer 7

Todo lo que necesitas hacer es ejecutar el siguiente script. luego, quite / vuelva a instalar el módulo que desea usar.

npm install --save @ types / react-redux

Answer 8

Tuve un error similar pero para mí fue react-router . Se solucionó instalando tipos para ello.

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.

Si desea deshabilitarlo en todo el sitio, puede editar tsconfig.json y configurar noImplicitAny en false .

Answer 9

Una forma más intrépida es agregar, por ejemplo, en boot.tsx la línea

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

con

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

en declare_modules.d.ts

Funciona pero otras soluciones son mejores IMO.