web-dev-qa-db-ja.com

Typescript反応-モジュール '' react-materialize 'の宣言ファイルが見つかりませんでした。 'path / to / module-name.js'には暗黙的にanyタイプがあります

私はreact-materializeからコンポーネントをインポートしようとしています-

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

しかし、Webパックが.tsxをコンパイルしているとき、上記のエラーがスローされます-

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.

これに対する解決策は、ts-loaderおよびwebpackで動作するようにこのインポートステートメントを解決する方法がわかりません。

React-materializeのindex.jsはこのように見えます。しかし、自分のファイルでモジュールをインポートするためにこれを解決する方法..

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

reactjswebpackwebpack-2
31
Joy

これをどうやって克服したか知りたい人のために。ハックのようなことをしました。

プロジェクト内で@Typesというフォルダーを作成し、tsconfig.jsonに追加して、そこからすべての必要なタイプを見つけました。だからこのように見える-

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

そしてその中にalltypes.d.tsというファイルを作成しました。それから未知のタイプを見つけるために。私にとってこれらは未知のタイプであり、私はそこにそれを追加しました。

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

だから今TypeScriptはもう見つからないタイプについて文句を言いませんでした。 :)今勝ち勝ち状況:)

35
Joy

同様のエラーが発生しましたが、私にとってはreact-routerでした。タイプをインストールして解決しました。

npm install --save @types/react-router

エラー：

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

サイト全体で無効にする場合は、代わりにtsconfig.jsonを編集し、noImplicitAnyをfalseに設定します。

28
Ogglas

反応還元型についても同じ問題がありました。最も簡単な解決策は、tsconfig.jsonに追加することです。

"noImplicitAny": false

例：

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

必要なことは、以下のスクリプトを実行することだけです。次に、使用するモジュールを削除/再インストールします。

npm install --save @types/react-redux
5
Tun

Tsconfig.jsonで、"noImplicitAny": falseを設定してこれを修正しました

2
SemineLee

私がやったことは、プロジェクトフォルダディレクトリでnodejsコマンドプロンプトから次のコマンドを実行しました：

  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. コードを追加して、App.jsファイルにパッケージ（ノードモジュール）をインポートします：import UniqueId from 'react-html-id';

私は上記を行いましたが（すでにnpmがインストールされていました）、それはうまくいきました！

2
naru123

また、使用しようとしているパッケージに独自のタイプファイルがある場合、このエラーは修正されますandpackage.jsontypings属性

そのようです：

{
  "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
}
2
Roy Art

よりハックな方法は、たとえばboot.tsxに次の行を追加することです

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

と

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

declare_modules.d.ts

動作しますが、他のソリューションの方がIMOの方が優れています。

2
Soleil

使用しているモジュールに@types/<package>がない場合、// @ts-ignoreを追加することで問題を簡単に修正できます。

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

または、次のように欠落している@types/<package>を作成できます。

宣言ファイルの公開

どのように貢献できるかを明確に入力

1
Mateja Petrović

私の場合、問題はdevDependenciesの下のpackage.jsonファイルにタイプが追加されないことでした。 npm install --save-dev @types/react-redux--save-devに注意してください

0
Japheth Ongeri - inkalimeva

うまくいく

npm install @types/react-materialize
0
Arturas