Babel.config.js only for jest

Question

we are using jest on a react typescript project. If there is a babel.config.js with preset: [@babel/preset-env] the test running successfully. But with the existence of that babel file our next.js web project is not compiling any more.

How can I setup this babel.config.js only for jest and not for next.js?

Answer 1

See Making your Babel config jest-aware

Jest will set process.env.NODE_ENV to 'test' if it's not set to something else. You can use that in your configuration to conditionally setup only the compilation needed for Jest, eg

babel.config.js :

module.exports = api => {
  const isTest = api.env('test');
  // You can use isTest to determine what presets and plugins to use.

  return {
    // ...
  };
};

Answer 2

An alternate solution to @slideshowp2 is to have a separate babelrc file dedicated to jest only.

For example, you can call it babel.config.testing.js then in your jest.config.js file, you tell jest to use this dedicated babelrc file:

module.exports = {
  transform: {
    '\\.js$': ['babel-jest', { configFile: './Configuration/babel.config.testing.js' }]
  },

};

Ref: https://github.com/facebook/jest/issues/3845#issuecomment-645298425