Babel with Jest, ESLint, Prettier, and Wallaby

Learn the integration of Babel with Jest, and the configuration of ESLint, Prettier, and Wallaby with Babel and JSX

Bridging Jest and Babel

Let’s bring Jest to the party.

  • In order to get Jest to run tests through Babel, you’ll need both jest and a package called babel-jest:

    $ npm install --save-dev jest@23.6.0 babel-jest@23.6.0
    + jest@23.6.0
    + babel-jest@23.6.0
    
  • As of this writing, you’ll also need a special version of the babel-core package. The reason is that the package recently switched names. Babel 6 called it babel-core, but Babel 7 namespaces it as @babel/core. So this package creates a bridge for projects looking for babel-core to direct them to @babel/core:

    $ npm install --save-dev babel-core@^7.0.0-bridge.0
    + babel-core@^7.0.0-bridge.0
    
  • Next, update the scripts entry in package.json to make Jest the project’s official test runner:

Get hands-on with 1400+ tech skills courses.