【问题标题】：tsc throws `TS2307: Cannot find module` for a local filetsc 为本地文件抛出“TS2307：找不到模块”
【发布时间】：2016-09-29 15:29:11
【问题描述】：

我有一个使用 TypeScript 的简单示例项目：https://github.com/unindented/ts-webpack-example

运行 tsc -p .（使用 tsc 版本 1.8.10）会引发以下内容：

app/index.ts(1,21): error TS2307: Cannot find module 'components/counter'.
components/button/index.ts(2,22): error TS2307: Cannot find module 'shared/backbone_base_view'.
components/button/index.ts(3,25): error TS2307: Cannot find module 'shared/backbone_with_default_render'.
components/counter/index.ts(2,22): error TS2307: Cannot find module 'shared/backbone_base_view'.
components/counter/index.ts(3,25): error TS2307: Cannot find module 'shared/backbone_with_default_render'.
components/counter/index.ts(4,27): error TS2307: Cannot find module 'shared/backbone_with_subviews'.
components/counter/index.ts(5,20): error TS2307: Cannot find module 'components/button'.

它抱怨所有本地文件的导入，如下所示：

import Counter from 'components/counter';

如果我将它更改为相对路径，它可以工作，但我不想这样做，因为它让我在移动文件时变得更加困难：

import Counter from '../components/counter';

vscode 代码库不使用相对路径，但对它们来说一切正常，所以我的项目中一定遗漏了一些东西：https://github.com/Microsoft/vscode/blob/0e81224179fbb8f6fda18ca7362d8500a263cfef/src/vs/languages/typescript/common/typescript.ts#L7-L14

您可以查看我的 GitHub 存储库，但如果有帮助，这里是我正在使用的 tsconfig.json 文件：

{
  "compilerOptions": {
    "target": "es5",
    "module": "commonjs",
    "noImplicitAny": false,
    "removeComments": false,
    "preserveConstEnums": true,
    "sourceMap": true,
    "outDir": "dist"
  },
  "exclude": [
    "dist",
    "node_modules"
  ]
}

有趣的是，通过webpack 使用ts-loader 构建项目工作正常，所以我猜这只是一个配置问题...

【问题讨论】：

标签： typescript

【解决方案1】：

@vladima 回复this issue on GitHub:

编译器解析模块的方式由 moduleResolution 选项，可以是node 或classic（更多详细信息和差异可以在here）找到。如果省略此设置如果模块是commonjs 和 classic - 否则。在你的情况下，如果你想要 classic 模块与commonjs 模块一起使用的解析策略 - 您需要设置明确地使用
{
    "compilerOptions": {
        "moduleResolution": "node"
    }
}

【讨论】：

我看到这个错误：error TS5023: Unknown compiler option 'moduleResolution'.
如果您在静态 .html 中使用 import * as microsoftTeams from "@microsoft/teams-js"; 是必需的，该静态 .html 使用由 MS 团队使用 tsc 编译的 .js 文件。
即使使用 moduleResolution = node 我也会收到此错误
Visual Studio 抛出此错误，因为它拒绝解析本地包的包含路径。三个小时后，比较模块版本，我们发现 VS 不喜欢包中一些安静的“隐式任何”错误。包的本地构建并没有抱怨，但VS真的不想使用它。

【解决方案2】：

在某些情况下，您只需要更新include 数组。

{
  "compilerOptions": {
    "target": "es6",
    "module": "commonjs",
    "moduleResolution": "node",
    "outDir": "dist",
    "sourceMap": false,
    "baseUrl": ".",
    "paths": {
      "@/*": ["src/*"]
    }
  },
  "include": ["src/**/*.ts", "tests/**/*.ts"],
  "exclude": ["node_modules", ".vscode"]
}

【讨论】：

还要检查您的exclude 属性！我的问题是exclude 排除了我的一些文件（当然，这是一个错误）。
这是我的解决方案。我将"exclude": [..., "**/*.test.ts"] 移动到我的tsconfig.build.json 文件中，以便打字稿可以在开发过程中解析模块，但仍然排除构建时的测试文件。

【解决方案3】：

在 VS2019 中，project 属性页，TypeScript Build 选项卡有一个“模块系统”设置（下拉菜单）。当我将其从“ES2015”更改为 CommonJS 时，VS2019 IDE 不再抱怨它既找不到 axios 也找不到 redux-thunk (TS2307)。

tsconfig.json:

{
  "compilerOptions": {
    "allowJs": true,
    "baseUrl": "src",
    "forceConsistentCasingInFileNames": true,
    "jsx": "react",
    "lib": [
      "es6",
      "dom",
      "es2015.promise"
    ],
    "module": "esnext",
    "moduleResolution": "node",
    "noImplicitAny": true,
    "noImplicitReturns": true,
    "noImplicitThis": true,
    "noUnusedLocals": true,
    "outDir": "build/dist",
    "rootDir": "src",
    "sourceMap": true,
    "strictNullChecks": true,
    "suppressImplicitAnyIndexErrors": true,
    "esModuleInterop": true,
    "allowSyntheticDefaultImports": true,
    "target": "es5",
    "skipLibCheck": true,
    "strict": true,
    "resolveJsonModule": true,
    "isolatedModules": true,
    "noEmit": true
  },
  "exclude": [
    "build",
    "scripts",
    "acceptance-tests",
    "webpack",
    "jest",
    "src/setupTests.ts",
    "node_modules",
    "obj",
    "**/*.spec.ts"
  ],
  "include": [
    "src",
    "src/**/*.ts",
    "@types/**/*.d.ts",
    "node_modules/axios",
    "node_modules/redux-thunk"
  ]
}

【讨论】：

找不到这个配置。它在哪里？
它位于tsconfig.json文件中。

【解决方案4】：

vscode 代码库不使用相对路径，但一切正常

真的取决于你的模块加载器。如果您将systemjs 与baseurl 一起使用，那么它会起作用。 VSCode 使用自己的自定义模块加载器（基于旧版本的 requirejs）。

推荐

使用commonjs 支持的相对路径。如果你移动文件，你会得到一个打字稿编译时错误（一件好事），所以你会比那里的绝大多数纯 js 项目（在 npm 上）更好。

【讨论】：

在 Visual Studio Code 本身中加载 vscode 代码库，我没有得到任何波浪线，因此 Visual Studio Code 以某种方式理解 import {notImplemented} from 'vs/base/common/errors'; 之类的内容，无论包含该代码的文件位于何处。他们是怎么做到的？

【解决方案5】：

我的问题是在不同的环境中构建。在我的 OSX 版本中没有任何问题。但是当我尝试在 Linux 环境上构建时，它失败了。其背后的原因是操作系统对大小写敏感。遇到此问题的任何人也请在导入时检查区分大小写。

文件结构是：

/X/Y.ts

我的导入是：

import Y from "./x/Y.ts";

所以，我的解决方法就是将“x”设为大写。

import Y from "./X/Y.ts";

【讨论】：

【解决方案6】：

如果使用 webstorm，请按 Ctrl+Alt+S 并打开设置窗口。 Languages&Frameworks>TypeScript，启用“use tsconfig.json”选项。

【讨论】：

在 WebStorm 2020.1 中，此选项已改写为“也适用于没有 tsconfig.json 的项目。”

【解决方案7】：

我在从 npm run watch 和 npm run hot 更新时遇到此错误。第一次或触发npm run dev或npm run prod时没有错误。

最后，这是webpack 和ts-loader 的组合，见：

npm run watch/hot only successful on the first run

【讨论】：

【解决方案8】：

有时当你的类文件没有正确命名时会抛出错误，例如我有名为 Employee 而不是 Employee.ts 的类文件

您需要将所有打字稿文件重命名为以.ts 或.d.ts 结尾

【讨论】：

【解决方案9】：

我在 typescript 中导入枚举时遇到了麻烦

错误 TS2307：找不到模块...

我所做的就是将枚举迁移到另一个文件并进行此更改：

export enum MyEnum{
    VALUE = "MY_VALUE"
}

到

export enum MyEnum{
    VALUE = 1
}

【讨论】：