TeamCity构建Angular项目时无法解析chart.js路径，如何修复？

一、解决构建错误：Can't resolve 'node_modules/chart.js/dist/Chart.js' #

这个错误是构建时无法找到指定的Chart.js文件，按以下步骤排查修复：

1. 确保依赖正确安装 #

在TeamCity构建流程中，必须在ng build前执行完整的依赖安装命令：

npm ci

（优先用npm ci而非npm install，它会严格匹配package-lock.json中的依赖版本，避免环境不一致问题）

如果存在缓存或依赖残留问题，先清理再重新安装：

npm cache clean --force
rm -rf node_modules package-lock.json
npm ci

2. 修正Chart.js的引入路径 #

Chart.js v3.x的UMD格式文件名是小写的chart.umd.js，而非大写开头的Chart.js。修改angular.json中scripts数组的路径：

"scripts": [
  "node_modules/chart.js/dist/chart.umd.js"
]

3. 改用模块化导入（推荐） #

更符合Angular最佳实践的方式是移除angular.json中的scripts配置，在需要使用Chart.js的组件/服务中直接导入：

import { Chart, registerables } from 'chart.js';
Chart.register(...registerables); // 注册所有必要组件

二、处理构建警告 #

1. 修复"Workspace extension with invalid name (defaultProject)"警告 #

检查angular.json的顶层结构，确保defaultProject配置项位于根节点（与projects同级），而非嵌套在错误位置。正确结构示例：

{
  "$schema": "./node_modules/@angular/cli/lib/config/schema.json",
  "version": 1,
  "newProjectRoot": "projects",
  "defaultProject": "your-project-name", // 确保该行在根节点
  "projects": {
    // 项目配置内容...
  }
}

2. 处理TypeScript compiler options警告 #

按照提示，通过Browserslist配置控制浏览器兼容性，无需手动修改tsconfig的target和useDefineForClassFields：

• 打开项目根目录的.browserslistrc文件（无则新建），添加需要支持的浏览器，例如：

last 2 Chrome versions
last 2 Firefox versions
last 2 Edge versions
last 2 Safari versions

Angular CLI会根据该配置自动调整TypeScript编译选项。

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