Estoy trabajando en un proyecto Next.js usando TypeScript y para probar uso Jest y React Testing Lib. Sin embargo, encuentro un SyntaxError: Cannot use import statement outside a module for components where import rehype-raw .

Según tengo entendido, Jest no es compatible con ES6, por lo que es posible que sea necesario transformar node_modules. Esto se puede configurar usando transformIgnorePatterns . Por ejemplo, si rehype-raw está causando este error usando "transformIgnorePatterns": ["node_modules/(?!rehype-raw)/"] debería permitir la transformación de rehype-raw pero ningún otro módulo. Y así solucionar este error.

Sin embargo, esto no funciona para mí. Pero no sé por qué y cómo puedo resolver esto. Ninguna solución sugerida que he encontrado podría resolver este problema. He adjuntado mi salida de error , jest.config.js y archivo babel.rc a continuación.

Salida de error

 FAIL test/pages/companies/[id].test.tsx ● Test suite failed to run Jest encountered an unexpected token [...] Details: /path/frontend-job/node_modules/rehype-raw/index.js:7 import {raw} from 'hast-util-raw' ^^^^^^ SyntaxError: Cannot use import statement outside a module 3 | import Image from 'next/image'; 4 | import { Remark } from 'react-remark'; > 5 | import rehypeRaw from 'rehype-raw'; | ^ 6 | import rehypeSanitize from 'rehype-sanitize'; 7 | import { logError } from '@utils/logger'; 8 | at Runtime.createScriptFromCode (node_modules/jest-runtime/build/index.js:1728:14) at Object.<anonymous> (components/markdown/JobMarkdown.tsx:5:1)

jest.config.js

 const { resolve } = require('path'); module.exports = { roots: ['<rootDir>'], moduleFileExtensions: ['js', 'jsx', 'ts', 'tsx', 'json', 'node'], setupFiles: ['<rootDir>/test/setup.js'], testPathIgnorePatterns: ['<rootDir>[/\\\\](node_modules|.next)[/\\\\]'], transform: { '^.+\\.(ts|tsx)$': 'babel-jest', }, transformIgnorePatterns: [ 'node_modules/(?!rehype-raw)/', ], watchPlugins: [ 'jest-watch-typeahead/filename', 'jest-watch-typeahead/testname', ], moduleNameMapper: { // Force mocks: https://github.com/facebook/jest/issues/4262 '@api/axios': '<rootDir>/test/__mocks__/axios.js', // Normal module aliases '\\.(css|less|sass|scss)$': 'identity-obj-proxy', '\\.(gif|ttf|eot|svg|png)$': '<rootDir>/test/__mocks__/fileMock.js', '^@test/(.*)$': resolve(__dirname, './test/$1'), '^@test/faker/(.*)$': resolve(__dirname, './test/faker/$1'), '^@components/(.*)$': resolve(__dirname, './components/$1'), '^@pages/(.*)$': resolve(__dirname, './pages/$1'), '^@utils/(.*)$': resolve(__dirname, './utils/$1'), '^@api/(.*)$': resolve(__dirname, './api/$1'), '^@store/(.*)$': resolve(__dirname, './store/$1'), }, testEnvironment: 'jsdom', };

babel.rc

 { "presets": ["next/babel"] }