Phản ứng kiểu chữ - Không thể tìm thấy tệp khai báo cho mô-đun '' react-materialize '. 'path / to / module-name.js' ngầm có một kiểu bất kỳ

Tôi đang cố gắng nhập các thành phần từ react-materialize dưới dạng:

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

Nhưng khi gói web đang nén của tôi, .tsxnó sẽ xuất hiện một lỗi ở trên là:

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.

Bất kỳ giải pháp nào cho vấn đề này. Tôi không chắc chắn cách giải quyết câu lệnh nhập này để làm việc với ts-loadervà webpack.

Hình index.jsthức của react-materialize như thế này. Nhưng làm cách nào để giải quyết vấn đề này cho việc nhập mô-đun trong các tệp của riêng tôi ..

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

Tôi đã gặp một lỗi tương tự nhưng đối với tôi thì như vậy react-router. Đã giải quyết nó bằng cách cài đặt các loại cho nó.

npm install --save @types/react-router

Lỗi:

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

Nếu bạn muốn vô hiệu hóa nó trên toàn trang web, thay vào đó, bạn có thể chỉnh sửa tsconfig.jsonvà đặt noImplicitAnythành false.

Đối với những người muốn biết rằng tôi đã vượt qua điều này như thế nào. Tôi đã làm một loại công cụ hack.

Bên trong dự án của mình, tôi đã tạo một thư mục có tên @typesvà thêm nó vào tsconfig.json để tìm tất cả các loại cần thiết từ nó. Vì vậy, nó trông giống như thế này -

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

Và bên trong đó tôi đã tạo một tệp có tên alltypes.d.ts. Để tìm các loại chưa biết từ nó. vì vậy đối với tôi đây là những loại không xác định và tôi đã thêm nó vào đó.

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

Vì vậy, bây giờ bảng chữ đã không phàn nàn về các loại không tìm thấy nữa. :) win win tình hình bây giờ :)

Tôi đã gặp vấn đề tương tự với các loại react-redux. Giải pháp đơn giản nhất là thêm vào tsconfig.json:

"noImplicitAny": false

Thí dụ:

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

Nếu không có @types/<package>mô-đun bạn đang sử dụng, bạn có thể dễ dàng giải quyết vấn đề bằng cách thêm // @ts-ignorenhận xét ở trên, tức là

// @ts-ignore
import { Navbar, NavItem } from 'react-materialize';

Ngoài ra, bạn có thể tạo phần @types/<package>sau bị thiếu :

xuất bản tệp khai báo

Chắc chắn Đã gõ làm cách nào để tôi có thể đóng góp

Trong trường hợp của tôi, tôi gặp sự cố với phản ứng, vì vậy tôi bắt đầu làm:

npm install @types/react

và sau đó đến

npm install @types/react-dom

Điều này đã làm việc cho tôi

Tất cả những gì bạn cần làm là chạy đoạn mã bên dưới. Sau đó, gỡ bỏ / cài đặt lại mô-đun mà bạn muốn sử dụng.

npm install --save @types/react-redux

Tôi đã gặp sự cố này khi tôi thêm vào react-router-domứng dụng CRA mới bằng cách sử dụng bảng chữ. Sau khi tôi thêm @types/react-router, sự cố đã được khắc phục.

Tôi đã gặp vấn đề tương tự nhưng không nhất thiết liên quan đến bảng chữ, vì vậy tôi đã đấu tranh một chút với các tùy chọn khác nhau này. Tôi đang tạo một ứng dụng tạo-phản ứng rất cơ bản sử dụng một mô-đun cụ thể thì react-portal-tooltip,gặp lỗi tương tự:

Không thể tìm thấy tệp khai báo cho mô-đun 'react-portal-tooltip'. '/node_modules/react-portal-tooltip/lib/index.js' mặc nhiên có kiểu 'bất kỳ'. Thử npm install @types/react-portal-tooltipxem nó có tồn tại không hoặc thêm tệp khai báo mới (.d.ts) có chứa declare module 'react-portal-tooltip';ts (7016)

Tôi đã thử nhiều bước trước - thêm nhiều .d.tstệp khác nhau, cài đặt npm khác nhau.

Nhưng những gì cuối cùng làm việc cho tôi touch src/declare_modules.d.ts sau đó là src/declare_modules.d.ts:

declare module "react-portal-tooltip";

và trong src/App.js:

import ToolTip from 'react-portal-tooltip';
// import './declare_modules.d.ts'

Tôi đã đấu tranh một chút với các vị trí khác nhau để sử dụng chiến lược 'khai báo mô-đun' chung này (tôi rất là người mới bắt đầu) vì vậy tôi nghĩ điều này sẽ hiệu quả với các tùy chọn khác nhau nhưng tôi được đưa vào các đường dẫn cho những gì phù hợp với tôi.

Ban đầu tôi nghĩ import './declare_modules.d.ts'là cần thiết. Mặc dù bây giờ có vẻ như không phải vậy! Nhưng tôi đang bao gồm cả bước trong trường hợp nó giúp ích cho ai đó.

Đây là câu trả lời stackoverflow đầu tiên của tôi vì vậy tôi xin lỗi vì quá trình rải rác ở đây và hy vọng nó vẫn hữu ích! :)

Ngoài ra, lỗi này sẽ được sửa nếu gói bạn đang cố sử dụng có (các) tệp loại riêng và được liệt kê trong thuộc tính package.json typings

Như vậy:

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

Một cách khó hiểu hơn là thêm ví dụ., Trong dòng boot.tsx

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

với

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

trong declare_modules.d.ts

Nó hoạt động nhưng các giải pháp khác IMO tốt hơn.

Những gì tôi đã làm là chạy các lệnh sau từ dấu nhắc lệnh nodejs khi ở trong thư mục thư mục dự án:

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. nhập gói (trong mô-đun nút) trong tệp App.js bằng cách thêm mã: import UniqueId from 'react-html-id';

Tôi đã làm như trên (mặc dù tôi đã cài đặt npm) và nó hoạt động!

Đối với trường hợp của tôi, vấn đề là các loại không được thêm vào tệp package.json trong devDependencies để khắc phục nó, tôi đã chạy npm install --save-dev @types/react-reduxlưu ý--save-dev

thử thêm vào tệp tsconfig.json: "noImplicitAny": false đã làm việc cho tôi

hoạt động tốt

npm install @types/react-materialize