Angular 13升级遇Transform失败错误，寻求解决方案

1. 优先排查Sass文件语法错误 #

错误提示明确指向login.component.sass第17行第100位存在未终止字符串令牌，这是最直接的问题：

• 打开该文件定位到对应行，检查是否存在未闭合的单/双引号，例如：

  // 错误示例：缺少闭合引号
  background: url('/assets/images/bg.jpg
  // 错误示例：引号嵌套未转义
  content: 'It's a test'
  

• 修正引号问题，确保所有字符串都有正确的闭合，嵌套引号使用转义符（如content: 'It\'s a test'）或交叉引号（如content: "It's a test"）。

2. 解决Sass依赖冲突 #

你的项目同时安装了node-sass和sass（dart-sass），而Angular 13官方推荐使用dart-sass，两者共存会导致构建冲突：

• 卸载node-sass：

  npm uninstall node-sass
  

• 降级sass到Angular 13兼容版本（1.56.0可能存在兼容性问题，建议使用1.55.x系列）：

  npm install sass@~1.55.0 --save-dev
  

• 注意：bootstrap-sass是针对node-sass开发的，切换到dart-sass后若出现新的编译错误，可考虑替换为官方bootstrap包的Sass版本：

  npm uninstall bootstrap-sass
  npm install bootstrap@~3.4.1 --save
  

  然后在全局样式中修改引用路径为@import "bootstrap/scss/bootstrap";。

3. 清理缓存并重建项目 #

依赖调整后清理缓存避免残留问题：

• 删除node_modules、package-lock.json和构建缓存：

  rm -rf node_modules package-lock.json .angular/cache
  

• 重新安装依赖并构建：

  npm install
  ng build
  

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