Typescript在给定绝对模块名时查找本地目录

Question

我目前正在做一个typescript项目，使用typescript模板为create-react-app。

我试图从src/components/Table.tsx中声明的组件导入react-table到我的项目中。我已经验证了react-table已经安装，并且它是特定类型的版本。npm list | grep table返回├── @types/react-table@7.7.2

当我尝试加载页面时，我收到的错误消息是Module not found: Can't resolve 'react-table' in/home/user/code/CompanyName/ProjectName/src/components

我可能是错的，但这表明我，javascript是未能在node_modules模块看。我能做些什么来引导编译器走向node_modules?

我的tsconfig.json在项目根目录下，如下所示:

{
"compilerOptions": {
"target": "es5",
"lib": [
"dom",
"dom.iterable",
"esnext"
],
"allowJs": true,
"skipLibCheck": true,
"esModuleInterop": true,
"allowSyntheticDefaultImports": true,
"noImplicitReturns": true,
"strict": true,
"forceConsistentCasingInFileNames": true,
"noFallthroughCasesInSwitch": true,
"module": "esnext",
"moduleResolution": "node",
"resolveJsonModule": true,
"isolatedModules": true,
"noUnusedLocals": true,
"noEmit": true,
"jsx": "react-jsx",

},
"include": [
"src"
]
}

值得注意的是，下面的导入存在于src目录中声明的组件中，它按预期工作并且不会产生错误。

import {
BrowserRouter as Router,
Switch,
Route,
} from "react-router-dom";

Answer 1

如果你的npm list | grep table只有给出@types/react-table而不是react-table，这就是你的问题。

总是你需要实际的模块，例如react-table。@types/版本仅下载模块的类型，假设模块没有自带类型，并且有人花时间将它们添加到@types/中。