如何用Jest搭配Prettier 3.0.0测试内联快照及相关支持问题

1. 如何使用Prettier 3.0.0进行内联快照测试？ #

目前Jest 29.x版本与Prettier 3.0+存在API兼容冲突，导致内联快照功能无法正常运行，可通过以下方式临时解决：

• 降级Prettier到2.x版本：执行npm install prettier@^2.8.8 --save-dev，回退至与Jest 29.x兼容的Prettier版本，即可正常使用toMatchInlineSnapshot()。
• 替换为普通快照：改用expect(xxx).toMatchSnapshot()，普通快照不依赖Prettier格式化逻辑，不受版本冲突影响。
• 自定义Prettier适配层：编写模拟Prettier 2.x API的适配脚本，供Jest调用：
  1. 在项目根目录新建prettier-adapter.js：

     const prettier = require('prettier');
     
     module.exports = {
       format: (code, opts) => prettier.format(code, { ...opts, parser: 'babel' })
     };
     

  2. 在jest.config.js中配置路径：

     module.exports = {
       // 其他配置项
       prettierPath: './prettier-adapter.js'
     };
     

  注意：该方案可能存在部分场景适配问题，需自行测试验证。

2. 官方是否计划添加支持或替代方案？ #

Jest团队已在官方仓库确认该兼容性问题，Jest 30版本会正式适配Prettier 3.0+的API，彻底解决内联快照的兼容问题。而Jest 29.x作为稳定分支，不会针对该功能做版本兼容更新，仅维护bug修复。可关注Jest官方发布节奏，待Jest 30正式发布后升级即可解决问题。

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