Loading babel.config error with React + Vite app

47 Views Asked by At

I'm building a new app with React and Vite and I would like to use a jest test with it. I configured it as usual but I have this information about an error:

npm run test

[email protected] test jest

FAIL src/components/test/sum.test.js ● Test suite failed to run

You appear to be using a native ECMAScript module configuration file, which is only supported when running Babel asynchronously.
    at C:\Users\dell\Desktop\test\swiggy-clone\babel.config.js

  at loadPartialConfigSync (node_modules/@babel/core/src/config/index.ts:49:60)
  at loadPartialConfigSync (node_modules/@babel/core/src/config/index.ts:68:14)
  at ScriptTransformer._getCacheKey (node_modules/@jest/transform/build/ScriptTransformer.js:228:41)
  at ScriptTransformer._getFileCachePath (node_modules/@jest/transform/build/ScriptTransformer.js:289:27)
  at ScriptTransformer.transformSource (node_modules/@jest/transform/build/ScriptTransformer.js:525:32)
  at ScriptTransformer._transformAndBuildScript (node_modules/@jest/transform/build/ScriptTransformer.js:674:40)
  at ScriptTransformer.transform (node_modules/@jest/transform/build/ScriptTransformer.js:726:19)

Test Suites: 1 failed, 1 total Tests: 0 total Snapshots: 0 total Time: 0.886 s Ran all test suites.

my babel.config.js is like this:

module.exports = {
  presets: [
    ["@babel/preset-env", { targets: { node: "current" } }]],
};



and my package.json like this:

{
  "name": "swiggy-clone",
  "private": true,
  "version": "0.0.0",
  "type": "module",
  "scripts": {
    "dev": "vite",
    "build": "vite build",
    "lint": "eslint . --ext js,jsx --report-unused-disable-directives --max-warnings 0",
    "preview": "vite preview",
    "test": "jest"
  },
  "dependencies": {
    "@reduxjs/toolkit": "^2.0.1",
    "react": "^18.2.0",
    "react-dom": "^18.2.0",
    "react-redux": "^9.1.0",
    "react-router-dom": "^6.21.1"
  },
  "devDependencies": {
    "@babel/core": "^7.23.7",
    "@babel/preset-env": "^7.23.8",
    "@testing-library/react": "^14.1.2",
    "@types/react": "^18.2.43",
    "@types/react-dom": "^18.2.17",
    "@vitejs/plugin-react": "^4.2.1",
    "autoprefixer": "^10.4.16",
    "babel-jest": "^29.7.0",
    "eslint": "^8.55.0",
    "eslint-plugin-react": "^7.33.2",
    "eslint-plugin-react-hooks": "^4.6.0",
    "eslint-plugin-react-refresh": "^0.4.5",
    "jest": "^29.7.0",
    "jest-environment-jsdom": "^29.7.0",
    "postcss": "^8.4.32",
    "tailwindcss": "^3.4.0",
    "vite": "^4.4.0"
  }
}

Con someone help me with this issue

0

There are 0 best solutions below