Jest - 在路徑 'xxx' 中找不到模組 'xxx'

Question

我有一個 react 應用程序，當我嘗試執行簡單測試時，它找不到組件中調用的檔案。

在應用程式中，一切正常。只是在玩笑測試時我才出現此錯誤。

知道如何告訴 jest 與 tsconfig 具有相同的配置嗎？

這是在測試的元件中失敗的導入：

import socialMediaToComponent from "ui/configs/socialMediaToComponent";

這是我的測試：

describe("SocialMediaArea", () => {
    it("should display specific social media links", () => {
        render(<SocialMedias />);
[...]

tsconfig：

{
    "compilerOptions": {
        "baseUrl": "src",
[...]

jest.config：

const config: Config.InitialOptions = {
    preset: "ts-jest",
    testEnvironment: "jsdom",
    verbose: true,
    rootDir: `src/`,
    moduleNameMapper: {
        "\.(jpg|png|webp|css|scss)$": "<rootDir>/__tests__/mocks/mockAssets/mockEmpty.ts",
        "\.svg": "<rootDir>/__tests__/mocks/mockAssets/mockReactComponents.ts",
    },
    testMatch: ["**/*.test.tsx"],
    setupFilesAfterEnv: ["<rootDir>/__tests__/setupTest.ts"],
};

export default config;

Answer 1

我找到了解決方案。把它放在這裡以防有幫助。 我在 jest.config.ts 中新增了：

import { compilerOptions } from '/app/tsconfig.json'

[...]
modulePaths: [compilerOptions.baseUrl],