Angular模块联邦下代码变更后应用重启失败求助

针对你遇到的模块联邦架构中单个微前端代码变更后重启失败、提示DefaultValueAccessor无法导入的问题，可按以下步骤排查修复：

• 统一共享依赖配置
  确认所有应用（主应用、微前端、共享库）的@angular/forms依赖配置一致：

  • 共享库的package.json中，将@angular/forms放在peerDependencies而非dependencies，避免重复打包
  • 模块联邦的共享配置中，强制@angular/forms单例且版本严格一致：

    // 模块联邦配置文件（如webpack.config.js或angular.json中的mf配置）
    shared: {
      '@angular/core': { singleton: true, strictVersion: true },
      '@angular/forms': { singleton: true, strictVersion: true },
      // 其他共享依赖保持同样配置
    }
    

• 清理缓存与依赖

  • 删除所有项目的node_modules、package-lock.json（或yarn.lock），重新执行npm install
  • 清理Angular构建缓存：ng cache clean
  • 启动开发服务器时禁用缓存：ng serve --no-cache

• 检查组件导入逻辑

  • 确认共享库中的ComponentFromSharedLibrary没有错误地二次导出@angular/forms的符号，所有组件直接从官方包导入：

    // 正确写法
    import { DefaultValueAccessor } from '@angular/forms';
    

  • 排查共享组件是否存在间接依赖DefaultValueAccessor但导入路径错误的情况

• 验证版本一致性

  • 确保所有项目的@angular/core、@angular/forms版本完全匹配，避免使用^或~导致的版本差异
  • 执行npm ls @angular/forms查看依赖树，确认没有多版本的@angular/forms共存

• 检查模块联邦暴露/消费配置

  • 确认出问题的微前端是通过模块联邦远程导入共享库，而非本地依赖
  • 检查共享库的模块暴露配置，确保组件及相关依赖符号正确导出

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