给定绝对模块名称时，打字稿在本地目录中查找答案

【问题标题】：Typescript looking in local directory when given an absolute module name给定绝对模块名称时，打字稿在本地目录中查找
【发布时间】：2021-07-29 16:55:37
【问题描述】：

我目前正在处理一个使用 create-react-app 的 typescript 模板制作的 typescript 项目。

我正在尝试将react-table 从src/components/Table.tsx 中声明的组件导入到我的项目中。我已经验证了 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";

【问题讨论】：

标签： javascript reactjs typescript react-table

【解决方案1】：

如果您的npm list | grep table 仅提供@types/react-table 而不是react-table，那就是您的问题。

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

【讨论】：