Angular极速入门
修改上述的图片中的start可修改访问端口和IPstart: ng serve --port 3000start: ng serve --port 3000 --host 0.0.0.0导入组件使用npm install ng-zorro-antd报错原因是npm 的依赖解析冲突问题主要原因是项目中不同包对 Angular 核心库 (angular/core) 的版本要求不一致错误分析当前安装的版本angular/core20.1.6冲突来源ng-zorro-antd20.1.2需要angular/core20.1.7(通过angular/animations20.1.7间接依赖)但你的项目和其他 Angular 包 (如angular/common,angular/forms等) 使用的是angular/core20.1.6解决方案第一步清理现有冲突# 删除node_modules和锁文件rm -rf node_modules package-lock.json第二步强制统一版本统一 Angular 版本统一升级 Angular 到 20.1.7# 使用覆盖安装方式 npm install --force angular/core20.1.7 angular/common20.1.7 angular/forms20.1.7 angular/platform-browser20.1.7 angular/animations20.1.7 然后同步其他Angular配套包 npm install --force angular/router20.1.7 angular/platform-server20.1.7 angular/service-worker20.1.7第三步更新开发依赖(使用ng update自动升级)npx ng update angular/cli angular/core然后安装 ng-zorro-antdnpm install ng-zorro-antd20.1.1最后显示成功效果如下常见问题除了上述依赖版本冲突外使用 ng-zorro-antd 时还可能遇到以下两个常见错误。错误一Cannot find module ng-zorro-antd/xxx该错误通常出现在按需引入组件或样式时提示找不到对应模块。常见原因包括安装的 ng-zorro-antd 版本与项目 Angular 版本不匹配导致模块路径解析失败。未正确配置angular.json中的样式引入路径。使用了错误的导入路径例如直接引用内部文件而非公开 API。解决方案确认 ng-zorro-antd 与 Angular 版本兼容建议统一使用ng update升级。在angular.json的styles数组中正确引入样式styles: [ node_modules/ng-zorro-antd/ng-zorro-antd.min.css ]按需引入组件时使用官方推荐的模块路径import { NzButtonModule } from ng-zorro-antd/button;错误二NGCC failedAngular 兼容性编译失败NGCCAngular Compatibility Compiler失败通常发生在安装依赖后提示类似NGCC failed或Entry point not found。常见原因包括node_modules 中存在损坏或不完整的包。Angular CLI 版本与项目依赖不兼容。缓存文件冲突导致编译流程中断。解决方案清理 node_modules 和锁文件后重新安装rm -rf node_modules package-lock.json npm install清除 Angular 编译缓存并重试npx ngcc --clean如果问题依旧尝试禁用 NGCC 缓存或升级 Angular CLInpx ng update angular/cli angular/core