typescript - "Module not found"扩展类时

Question

每次当我尝试扩展抽象类 Command 并尝试编译时，我都会收到错误:Error: Cannot find module 'src/classes/commandBase'

我的项目有以下结构:

   ├────tsconfig.json
   └────src
        ├───classes
        │   └───commandBase.ts
        ├───commands
        │   └───ping.ts
        ├───handlers
        ├───listeners
        └───models

命令库.ts

abstract class Command {
  name: string;
  abstract execute(client: Client, message: Message, args: string[]): void;

  constructor(name: string) {
    this.name = name;
  }
}
export default Command;

平.ts

import Command from "src/classes/commandBase";

class Ping extends Command {
  constructor() {
    super("ping");
  }
  async execute(
    client: Client,
    message: Message,
    args: string[]
  ): Promise<void> {
    // ...
  }
}

export default Ping;

tsconfig.json

{
  "compilerOptions": {
    "target": "ESNext",
    "module": "CommonJS",
    "rootDir": "./src/",
    "outDir": "./dist/",
    "strict": true,
    "moduleResolution": "node",
    "importHelpers": true,
    "experimentalDecorators": true,
    "esModuleInterop": true,
    "skipLibCheck": true,
    "allowSyntheticDefaultImports": true,
    "resolveJsonModule": true,
    "forceConsistentCasingInFileNames": true,
    "removeComments": true,
    "typeRoots": ["node_modules/@types"],
    "sourceMap": true,
    "baseUrl": ".",
    "paths": {}
  },
  "include": ["./**/**/*.ts"],
  "exclude": ["node_modules", "dist"]
}

---

然而

如果我将 import Command from "src/classes/commandBase"; 更改为 import Command from "../classes/commandBase"; 一切都有效很好，没有错误出现。问题是我使用自动完成(VS 代码)，每次我导入“命令”时，它都会自动写入 "src/classes/commandBase";

另一件事是，如果我创建一个不扩展 Command 但导入它的新文件，一切也都按预期工作。所以我对这种行为很困惑。

文件 foo.ts

import Command from "src/classes/commandBase";

const foo: Command = {
  name: "",
  execute: function (client: Client, message: Message, args: string[]): void {
    throw new Error("Function not implemented.");
  }
}

Answer 1

那是因为你的Classes和Commands文件夹在src目录下，你不需要离开那个目录。如果您从主文件夹运行，您的路径应该类似于 ./classes/或 ./commands/Ping。

Here is not specified "./" before source folder

../表示你要离开当前目录上一级 ./在当前目录中

在您的设置中添加 JSON "typescript.preferences.importModuleSpecifier": "relative",

我运行此配置，检查结构和配置是否在 tsconfig.json 中使用 about 模块，并选择“绝对路径”来避免相对路径情况，如“../../../”

import Command from "@classes/commandBase";

tsconfig.json

/* Modules */
    "module": "commonjs",
    "rootDir": "./src",
    "baseUrl": ".",
    "paths": { /* Set absolute paths with '@path' */
      "@config/*": ["./src/config/*"],
      "@controllers/*": ["./src/controllers/*"],
      "@services/*": ["./src/services/*"],
      "@classes/*": ["./src/classes/*"],
      "@commands/*": ["./src/commands/*"],
      "@routes/*": ["./src/routes/*"],
      "@pages/*": ["./src/pages/*"],
      "@utils/*": ["./src/utils/*"],
      "@middlewares/*": ["./src/middlewares/*"]
    }

    // Allow multiple folders to be treated when resolving modules
    "typeRoots": [
      "./node_modules/@types",
      "./src/@types"

package.json

    "plugins": [
      [
        "module-resolver",
        {
          "alias": {
            "@config": "./src/config",
            "@controllers": "./src/controllers",
            "@services": "./src/services",
            "@classes": "./src/classes",
            "@commands": "./src/commands",
            "@routes": "./src/routes",
            "@pages": "./src/pages",
            "@utils": "./src/utils",
            "@middlewares": "./src/middlewares"
          }
        }
      ]
    ]
  }
}