Using With Webpack

Using With Webpack

Jest can be used in projects that use webpack to manage assets, styles, and compilation. webpack does offer some unique challenges over other tools because it integrates directly with your application to allow managing stylesheets, assets like images and fonts, along with the expansive ecosystem of compile-to-JavaScript languages and tools.

A webpack example

Let's start with a common sort of webpack config file and translate it to a Jest setup.

// webpack.config.js
module.exports = {
  module: {
    loaders: [
      {exclude: ['node_modules'], loader: 'babel', test: /\\.jsx?$/},
      {loader: 'style-loader!css-loader', test: /\\.css$/},
      {loader: 'url-loader', test: /\\.gif$/},
      {loader: 'file-loader', test: /\\.(tt