2017-01-04 10 views
7

próbuję zaimportować komponenty z reagują-zmaterializować jako -Receptura tekstu - nie można znaleźć pliku deklaracji dla modułu "" zmaterializuj reakcję ". „Ścieżka/do/modułu-name.js” niejawnie posiada każdy rodzaj

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

Ale kiedy WebPack jest compining mój .tsx zgłasza błąd za jak wyżej -

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. 

Wszelkie rozdzielczość to .I'm pewien jak rozwiązać tę instrukcję import do pracy z ts-loader i WebPack.

index.js od reagują-Materialise wygląda to lubi. Ale w jaki sposób rozwiązać ten problem dla importu modułu w moim plików ..

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

+1

Musisz zainstalować typowania/typów dla pakietu (npm zainstalować @ typów/reagują-zmaterializować). Wygląda jednak na to, że jeszcze nie istnieje, więc być może trzeba go samemu utworzyć. Pomyślałem, że ten artykuł jest pomocny - https://templecoding.com/blog/2016/03/31/creating-typescript-typings-for-existing-react-components/ –

+0

@ T Mitchell, więc oznacza to wszelkiego rodzaju typy, które brakuje nam nigdy nie bylibyśmy w stanie skompilować webpacka bez tego tworzenia tych typów? Powinien być jakiś sposób? – Joy

+2

Istnieje sposób - http://stackoverflow.com/questions/38224232/how-to-consume-npm-modules-from-typescript –

Odpowiedz

9

dla tych, którzy chcieli wiedzieć, że jak ja to przezwyciężyć. Zrobiłem coś w rodzaju "hack".

Wewnątrz mojego projektu utworzyłem folder o nazwie @Types i dodał go do tsconfig.json, aby znaleźć wszystkie wymagane typy z niego. Tak to wygląda mniej więcej tak -

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

A w środku, że utworzony plik o nazwie alltypes.d.ts. Aby znaleźć nieznane typy z niego. więc dla mnie były to nieznane typy i dodałem je tam.

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

Teraz maszynopis nie narzekał na typy, które nie zostały znalezione. :) Wszyscy wygrywają sytuacja teraz :)

+0

Brakowało mi części o tym, że jest w osobnym pliku. Wygląda na to, że umieszczenie tych instrukcji 'declare' w pliku o nazwie' index.d.ts' naprawiło to dla mnie. Nie musiałem dotykać typeRoots. –

+0

Działa to dobrze, ale powoduje problemy podczas używania 'require 'dla innych rzeczy, takich jak obrazy. Zasadniczo, po prostu nie pozwala ci użyć 'require' do niczego. –

+0

to rozwiązanie nie działa z najnowszą wersją TS. 'nvalid nazwa modułu w rozszerzeniu. Moduł "some-dumb-lib-with-nots types" rozwiązuje się na module bez typu "/ path/to/module", którego nie można rozszerzyć. " – FlavorScape

7

Miałem podobny błąd, ale dla mnie to było react-router. Rozwiązał go, instalując dla niego typy.

npm install --save @types/react-router 

Błąd:

(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. 

Jeśli chcesz wyłączyć stronę szeroko można zamiast edytować tsconfig.json i ustawić noImplicitAny do false.

1

Również ten błąd zostanie ustalone, czy pakiet starasz się używać ma swój typ pliku (ów) i to wymieniono go w package.jsontypings atrybutu

tak:

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

bardziej hacky sposobem jest dodanie np. w boot.tsx linii

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

z

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

w declare_modules.d.ts

To działa, ale inne rozwiązania są lepsze IMO.

0

Wszystko, co musisz zrobić, to uruchomić poniższy skrypt.następnie usuń/ponownie zainstaluj moduł, którego chcesz użyć.

npm zainstalować flagą --save @ typów/reagują-Redux

Powiązane problemy