Facing Jest encountered an unexpected token while using Require with JEST

Question

I have problem like:

Jest encountered an unexpected token

I did not find a correct solution for my boilerplate. I have checked documentation of JEST or some code here but things which I do does not works. Could you help me at this issue ? I added knowledges below.

My package.json:

{
  "jest": {
    "testMatch": [
      "<rootDir>/src/**/*.test.{js,jsx,ts,tsx}",
      "<rootDir>/src/**/?(*.)(spec|test).{js,jsx,ts,tsx}"
    ],
    "testEnvironment": "jsdom"
  },
  "scripts": {
    "test": "jest"
  },
  "devDependencies": {
    "@babel/core": "^7.17.2",
    "@babel/preset-env": "^7.16.11",
    "@babel/preset-react": "^7.10.4",
    "@babel/preset-typescript": "^7.10.4",
    "@svgr/webpack": "^5.5.0",
    "@testing-library/react": "^12.1.2",
    "babel-loader": "^8.2.3",
    "cross-env": "^7.0.2",
    "html-webpack-plugin": "^4.4.1",
    "mini-css-extract-plugin": "^0.11.1",
    "node-sass": "^4.14.1",
    "react": "^16.13.1",
    "react-dom": "^16.13.1",
    "typescript": "^4.0.2",
  },
  "dependencies": {
    "@testing-library/jest-dom": "^5.16.2",
    "babel-jest": "^27.5.1",
    "dotenv": "^8.2.0",
    "dotenv-webpack": "^6.0.2",
    "identity-obj-proxy": "^3.0.0",
    "jest": "^27.5.1",
    "jest-config": "^27.5.1",
    "react-dotenv": "^0.1.3",
    "ts-jest": "^27.1.3"
  }
}

My jest.config.js:

module.exports = {
  preset: 'ts-jest',
  setupFilesAfterEnv: ["@testing-library/jest-dom/extend-expect"],
  testEnvironment: "jsdom",
  verbose: true,
  moduleNameMapper: {
    "\\.(css|less|scss|sss|styl)$": "<rootDir>/node_modules/identity-obj-proxy"
  }
};

.babelrc :

{
  "presets": [
    "@babel/preset-env",
    "@babel/preset-react",
    "@babel/preset-typescript"
  ]
}

Error Image :

Answer 1

Don't use require mixed with import