Angular从v12升级到v13时出现Module not found错误如何解决

这个报错是Angular v13升级后的典型兼容问题：Angular v13默认使用Webpack 5构建，Webpack 5对package.json中exports字段的解析规则远严格于Angular v12使用的Webpack 4，禁止直接用./这种目录导入写法，必须指定明确的文件路径。

排查步骤 #

• 打开报错指向的./src/app/models/type/ModelType.ts文件，检查第2行的导入语句，优先确认是否存在import * as xxx from './'这类直接导入当前目录的写法，改为明确导入对应文件（比如import * as xxx from './index.ts'）即可解决
• 检查你升级的所有第三方依赖包：如果某依赖的package.json配置了exports字段，但你导入该依赖时使用了目录导入写法（比如import xx from 'some-package/utils'而非import xx from 'some-package/utils/index.js'），也会触发该报错
• 检查项目tsconfig.json配置，若compilerOptions.moduleResolution设置为node16/nodenext，对目录导入的要求会更严格，可临时改为node快速兼容，建议后续逐步梳理所有不规范导入语句
• 若项目是monorepo结构/存在自定义内部包，检查对应子包的package.json的exports字段配置，确认是否为需要导入的目录配置了默认导出入口，比如给./路径配置"import": "./index.ts"规则

临时验证方案：可在angular.json的build.options节点新增"resolveExports": false配置，关闭Webpack对exports字段的严格解析，先跑通项目再逐步排查修正不规范写法

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