wallaby-webpack

3.9.16 verified Sat Apr 25 auth: no javascript maintenance

Wallaby.js postprocessor for webpack build support. Version 3.9.16 is current stable. Integrates webpack into Wallaby.js test runner, enabling module resolution, loaders, and plugins during testing. Key differentiator: allows using existing webpack configs with Wallaby for seamless testing of webpack-bundled projects.

Common errors

error Error: Cannot find module 'wallaby-webpack' ↓

cause Package not installed.

fix

Run 'npm install wallaby-webpack --save-dev'.

error TypeError: wallabyWebpack is not a function ↓

cause Incorrect import (named instead of default).

fix

Use 'const wallabyWebpack = require("wallaby-webpack");'.

error Module parse failed: Unexpected token ↓

cause Missing loaders for file types (e.g., JSON).

fix

Add appropriate loader to webpack config in postprocessor.

Warnings

deprecated webpack 1 loaders syntax is deprecated. Use 'module.rules' instead. ↓

fix Replace 'module.loaders' with 'module.rules' in webpack config.

gotcha External modules may not be properly resolved if not configured. ↓

fix Add externals such as 'fs' or 'path' to avoid bundling Node built-ins.

gotcha Postprocessor must be placed after compilers in configuration. ↓

fix Ensure 'postprocessor' appears after 'compilers' in the config object.

Install

npm install wallaby-webpack

yarn add wallaby-webpack

pnpm add wallaby-webpack

Imports

wallabyWebpack
wrong
```
import wallabyWebpack from 'wallaby-webpack';
```
correct
```
const wallabyWebpack = require('wallaby-webpack');
```
CommonJS require is standard; ESM import may fail in Node environments without transpilation.

wallabyWebpack

wrong

import { wallabyWebpack } from 'wallaby-webpack';

correct

import wallabyWebpack from 'wallaby-webpack';

Default export only; named import will result in undefined.

TypeScript import

wrong

import wallabyWebpack from 'wallaby-webpack'; (may need esModuleInterop)

correct

import * as wallabyWebpack from 'wallaby-webpack';

With TypeScript and esModuleInterop, default import works; otherwise use namespace import.

Quickstart

Configure Wallaby.js to use webpack postprocessor with custom webpack options.

// wallaby.config.js
const wallabyWebpack = require('wallaby-webpack');

module.exports = function (w) {
  return {
    files: ['src/**/*.js', 'test/**/*.js'],
    tests: ['test/**/*.spec.js'],
    compilers: { '**/*.js': w.compilers.babel() },
    postprocessor: wallabyWebpack({
      resolve: {
        alias: { '@': 'src' }
      },
      externals: {
        'fs': true
      },
      module: {
        loaders: [
          { test: /\.json$/, loader: 'json-loader' },
          { test: /\.html$/, loader: 'html-loader' }
        ]
      }
    }),
    env: {
      type: 'node'
    }
  };
};