Angular 15共享模块类继承问题：VS Code报错但编译正常

问题拆解与对应解决方案 #

1. VS Code无法解析@shared/models/class2路径 #

• 核心原因：VS Code依赖tsconfig.json中的路径别名配置识别自定义路径，未配置或配置错误会导致解析失败。
• 解决步骤：
  1. 打开项目根目录的tsconfig.json，检查compilerOptions.paths节点，确保@shared/*指向正确的共享模块路径：

     "compilerOptions": {
       // 其他配置...
       "paths": {
         "@shared/*": ["./src/app/shared/*"] // 根据实际目录结构调整
       }
     }
     

  2. 重启VS Code的TypeScript服务：按下Ctrl+Shift+P（Windows/macOS），输入并选择TypeScript: Restart TS Server。

2. VS Code提示Class1不存在prop1属性 #

• 直接原因：路径解析失败导致TypeScript无法识别父类Class2的属性定义，属于路径问题引发的连锁类型检查错误。解决上述路径问题后，该提示会自动消失。
• 额外验证：确认Class2中prop1的拼写、大小写与子类使用的完全一致，且Class2已正确导出。

3. 运行时对象无prop1属性 #

• 核心原因：父类Class2仅声明prop1但未初始化，若子类赋值逻辑未执行或对象未通过类构造函数实例化，会导致运行时缺失该属性。
• 解决方式：
  1. 在父类构造函数中初始化prop1，确保所有子类实例都具备该属性：

     export class Class2 {
       prop1: number;
       constructor() {
         this.prop1 = 0; // 设置合理默认值，根据业务需求调整
       }
     }
     

  2. 若对象从JSON数据转换而来，禁止直接使用类型断言（as Class1），必须通过类构造函数实例化后再赋值：

     // 错误示例：仅类型断言不会触发类初始化逻辑
     const invalidObj: Class1 = JSON.parse(apiData) as Class1;
     // 正确示例：先实例化再赋值
     const validObj = new Class1();
     Object.assign(validObj, JSON.parse(apiData));
     

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