[英]Typescript - Cannot find module ... or its corresponding type declarations
I created a new project using create-react-app and yarn 2 in vs code.我在 vs 代码中使用 create-react-app 和 yarn 2 创建了一个新项目。 The editor throws errors while importing every installed library like this:
编辑器在导入每个已安装的库时抛出错误,如下所示:
Cannot find module 'react' or its corresponding type declarations.
找不到模块“react”或其对应的类型声明。
The project compiles and runs successfully but the errors are still there.该项目编译并运行成功,但错误仍然存在。 When I change the file's extension to .js and .jsx from.
当我将文件的扩展名从更改为.js和.jsx时。 ts and .tsx , the errors disappear.
ts和.tsx ,错误消失。 How should I solve this problem for typescript files?
我应该如何解决打字稿文件的这个问题?
You need to install types for libraries you install.您需要为您安装的库安装类型。 generally you should do:
通常你应该这样做:
npm install @types/libName // e.g. npm install @types/react-leaflet
Some times there's no types available in DefinitelyTyped repo and you encounter npm ERR! 404 Not Found: @types/my-untyped-module@latest
有时, DefinitelyTyped 存储库中没有可用的类型,而您会遇到
npm ERR! 404 Not Found: @types/my-untyped-module@latest
npm ERR! 404 Not Found: @types/my-untyped-module@latest
. npm ERR! 404 Not Found: @types/my-untyped-module@latest
。 You can do several things in this occasion:在这种情况下,您可以做几件事:
1- Create a decs.d.ts
file in root of your project and write in it: 1-在项目的根目录中创建一个
decs.d.ts
文件并写入其中:
declare module "libName" // e.g declare module 'react-leaflet'
2- Or simply suppress the error using @ts-ignore
: 2-或者简单地使用
@ts-ignore
抑制错误:
// @ts-ignore
import Map from 'react-leaflet'
3- Or you can do yourself and others a favor and add the library types in DefinitelyTyped repo. 3-或者您可以帮自己和其他人一个忙,并在绝对类型存储库中添加库类型。
If it still doesn't work, I firstly recommend that you use a recent version of Typescript.如果它仍然不起作用,我首先建议您使用最新版本的 Typescript。 if you do, then close your editor, delete
node_modules
folder and install the dependencies again ( npm install
or yarn install
) and check it again.如果这样做,请关闭编辑器,删除
node_modules
文件夹并再次安装依赖项( npm install
或yarn install
)并再次检查。
I had the same error message, also related to the imports.我有同样的错误消息,也与导入有关。
In my case, the problem was caused by importing a png file in order to use it in an SVG:就我而言,问题是由于导入 png 文件以便在 SVG 中使用它引起的:
import logo from 'url:../../public/img/logo.png';
The message I received was:我收到的消息是:
Cannot find module 'url:../..public/img/logo.png' or its corresponding type declarations.
In project root is a file css.d.ts
.在项目根目录中是一个文件
css.d.ts
。 One must declare a module for the various graphics extensions (types) that are imported.必须为导入的各种图形扩展(类型)声明一个模块。 (Note: Not for graphics types that are used or referenced in the project, but for those that are imported )
(注意:不是针对项目中使用或引用的图形类型,而是针对导入的图形类型)
Here is the complete css.d.ts
file for this project:这是该项目的完整
css.d.ts
文件:
declare module '*.scss' {
const css: { [key: string]: string };
export default css;
}
declare module '*.sass' {
const css: { [key: string]: string };
export default css;
}
declare module 'react-markup';
declare module '*.webp';
declare module '*.png';
declare module '*.jpg';
declare module '*.jpeg';
my situation:我的情况:
myFolder
is under the src
dir myFolder
在src
目录下
I see the same error in this line:我在这一行看到同样的错误:
import { GlobalStyle } from "myFolder";
other answers dont work.其他答案不起作用。
I simply add baseUrl
to tsconfig.json
inside compilerOptions
:我只需将
baseUrl
添加到compilerOptions
内的tsconfig.json
:
{
"compilerOptions": {
"baseUrl": "src/",
//other config...
},
"include": [
"src"
]
}
issue solved!问题解决了!
ref: https://www.typescriptlang.org/tsconfig#baseUrl参考: https://www.typescriptlang.org/tsconfig#baseUrl
Using VsCode:使用代码:
type: ctrl + shift + p输入:ctrl + shift + p
choose: > TypeScript: Restart TS server选择:> TypeScript:重启 TS 服务器
I fixed my issue我解决了我的问题
/types/css.d.ts
/types/css.d.ts
tsconfig.json
tsconfig.json
add this object:添加这个对象:
"include": [
"src",
"types"
]
请在您的登录电子邮件中使用以下命令
ssh-keygen -t rsa -b 4096 -C "<<your login email >>"
Check the dependencies object in package.json file.检查 package.json 文件中的依赖项对象。 If the install package is in the format "@somepackage/packagename":version;
如果安装包的格式为“@somepackage/packagename”:version; then at the time of import you must use import abc from "@somepackage/packagename"
然后在导入时你必须使用 import abc from "@somepackage/packagename"
If "@somepackage/" is not there then don't use it at the time of import.如果“@somepackage/”不存在,则在导入时不要使用它。 Just simply use import abc from "packagename";
只需简单地使用 import abc from "packagename";
yarn2,3 has error for it. yarn2,3 有错误。
you need to use yarn 1.22.1 version for it.你需要使用 yarn 1.22.1 版本。
1. uninstall yarn
2. install yarn.
3. yarn set version 1.22.1
4. yarn policies set-version 1.22.1
在我的情况下,我的文件名为index.tsx<\/code>而它应该是大写的
I<\/code> ,所以
Index.tsx<\/code> 。
"
In my case it was just an autocomplete import (like "@reduxjs/toolkit/src/query/tests/mocks/server") done by the VS Code that I didn't notice while commiting在我的情况下,它只是由 VS Code 完成的自动完成导入(如“@reduxjs/toolkit/src/query/tests/mocks/server”),我在提交时没有注意到
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.