使用TS编写Gatsby站点Jest配置时__PATH_PREFIX__类型报错如何解决

问题原因 #

你遇到的类型报错是因为配置结构写错了：你把testPathIgnorePatterns、transformIgnorePatterns、globals、testURL、setupFiles这些Jest的顶级配置项，错误嵌套进了moduleNameMapper字段内部。
moduleNameMapper的类型定义要求所有属性的值只能是string | string[]类型，你把对象类型的globals放在这里，自然触发类型不匹配的错误。

修复方法 #

把错误嵌套在moduleNameMapper里的配置项，挪到和transform、testEnvironment同级的根配置层级即可，同时注意正则字符串里的特殊字符需要做转义处理。

修正后的完整代码 #

import type { InitialOptionsTsJest } from 'ts-jest/dist/types'
import { jsWithBabel as tsjPreset } from 'ts-jest/presets'

const config: InitialOptionsTsJest = {
  transform: {
    ...tsjPreset.transform,
  },
  testEnvironment: 'node',
  moduleNameMapper: {
    '.+\\.(css|styl|less|sass|scss)$': `identity-obj-proxy`,
    '.+\\.(jpg|jpeg|png|gif|eot|otf|webp|svg|ttf|woff|woff2|mp4|webm|wav|mp3|m4a|aac|oga)$': `<rootDir>/__mocks__/file-mock.js`,
  },
  testPathIgnorePatterns: [`node_modules`, `\\.cache`, `<rootDir>.*/public`],
  transformIgnorePatterns: [`node_modules/(?!(gatsby)/)`],
  globals: {
    __PATH_PREFIX__: '',
  },
  testURL: `http://localhost`,
  setupFiles: [`<rootDir>/loadershim.js`],
}

export default config

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