React项目重装依赖后报pdf.js模块解析失败需额外loader错误

删除node_modules和yarn.lock后重新执行yarn install时，依赖版本不再受旧锁文件约束，会拉取符合package.json声明版本范围的最新版pdfjs-dist。新版pdfjs-dist源码中使用了ES2020标准的可选链操作符（即报错位置this._transport?.destroy()里的?.语法），但你项目使用的react-scripts版本偏老，内置的babel-loader默认没有配置该语法的转译规则，无法解析这段代码，直接抛出模块解析失败的错误。

按操作成本从低到高，任选一种方案处理即可：

• 固定pdfjs-dist到兼容版本（最省事，无额外兼容风险）
  先卸载当前安装的不兼容新版pdfjs-dist，安装已经做过全量语法转译、兼容老构建工具的旧稳定版：

  yarn remove pdfjs-dist
  yarn add pdfjs-dist@2.16.105
  

  安装完成后重启本地开发服务、重新执行构建命令即可恢复正常，不需要调整任何项目构建配置。
• 升级react-scripts到支持新语法的版本
  react-scripts 5.0及以上版本内置了ES2020全量语法的转译支持，直接升级到该版本即可兼容最新版pdfjs-dist的语法：

  yarn add react-scripts@5
  

  如果是从4.x及更早版本跨大版本升级，注意同步检查项目内其他React生态依赖的版本兼容情况，避免触发其他构建报错。
• 自定义构建配置转译pdfjs-dist源码（非必要不推荐）
  如果既不想降低pdfjs-dist版本，也不想升级react-scripts，可以借助craco或者react-app-rewired修改webpack配置，让babel-loader覆盖处理node_modules/pdfjs-dist目录下的文件，添加可选链语法转译插件完成兼容。该方案需要改动项目构建配置，后续依赖升级时维护成本较高。

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