Vue3单元测试运行提示Cannot find module导入路径报错如何解决？

问题解决方案 #

这个错误是因为Jest未配置识别TypeScript文件后缀、也未配置对应的TS文件转译规则导致的，按以下步骤修改Jest配置即可解决：

1. 新增moduleFileExtensions配置项，声明Jest可识别的文件后缀
2. 新增TS文件转译规则，使用ts-jest处理.ts/.tsx文件
3. 补充ts-jest的全局配置，指定读取项目的tsconfig.json

修改完成后的完整Jest配置如下：

"jest": {
    "globals": {
      "vue-jest": {
        "hideStyleWarn": true
      },
      "ts-jest": {
        "tsconfig": "tsconfig.json"
      }
    },
    "preset": "@vue/cli-plugin-unit-jest",
    "testMatch": [
      "**/src/**/*.spec.[jt]s?(x)"
    ],
    "moduleFileExtensions": ["js", "jsx", "ts", "tsx", "vue", "json"],
    "transform": {
      "^.+\\.vue$": "vue-jest",
      "^.+\\.tsx?$": "ts-jest"
    },
    "transformIgnorePatterns": [
      "<rootDir>/node_modules/(?!primevue/.*)"
    ]
  }

额外检查项

• 确认product.models文件后缀为.ts，文件路径和导入路径的大小写完全匹配（Jest对路径大小写敏感，和本地开发运行时的宽松匹配规则不同）
• 确认项目已安装ts-jest依赖，未安装的话执行npm install ts-jest -D安装即可
• 若ITEM是纯TypeScript类型，建议把导入语句改为import type { ITEM } from "../models/product.models";，避免转译后残留无效导入

内容的提问来源于stack exchange，提问作者user4094935