Angular项目中浏览器加载hammerjs版本不符问题求助

• 检查全量依赖树
  执行npm ls hammerjs --all，查看所有直接和间接依赖中hammerjs的版本。很多Angular生态包（比如@angular/material、@angular/cdk）会依赖hammerjs，可能存在某个包指定了2.0.7的版本，导致npm解析时优先使用了该版本。

• 清理依赖并重装

  1. 删除node_modules目录：
     • Linux/macOS：rm -rf node_modules
     • Windows：rmdir /s /q node_modules
  2. 清理npm缓存：npm cache clean --force
  3. 重新安装依赖：npm install
  4. 安装完成后再次执行npm list hammerjs确认版本，然后重新构建项目。

• 排查构建产物与静态资源

  1. 构建项目后，在dist（或自定义构建输出目录）中找到hammerjs相关文件，查看文件内的版本标识。
  2. 检查项目的index.html文件，确认是否直接通过CDN引入了hammerjs 2.0.7版本，这种情况下会覆盖npm安装的版本。

• 清除浏览器缓存

  • 强制刷新页面（Ctrl+Shift+R / Cmd+Shift+R），清除浏览器缓存后重新加载，查看Sources标签中的hammerjs版本是否更新。
  • 如果项目启用了Service Worker，需要在浏览器开发者工具的Application标签中注销Service Worker并清除相关缓存。

• 检查第三方嵌入SDK
  项目中使用的amazon-quicksight-embedding-sdk等第三方SDK，可能自带了hammerjs 2.0.7并注入到页面中，需要确认这类资源的依赖情况。

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