Webpack Pre-Build Hook Plugin

0.1.0 · abandoned · verified Wed Apr 22

The `pre-build-webpack` package provides a Webpack plugin that allows developers to execute a custom callback function immediately before the Webpack build process commences. Currently at version 0.1.0, the package appears to be an early-stage project that has seen no updates in several years, suggesting it is no longer actively maintained. Its core functionality is to offer a simple hook for pre-build tasks, such as cleaning directories, preparing environment variables, or dynamically adjusting configuration, prior to any asset compilation. This differentiates it from post-build plugins like `on-build-webpack` by targeting an earlier stage in the compilation lifecycle. Given its age and low version number, users should be cautious about its compatibility with modern Webpack versions (v4, v5, or v6+) and the availability of similar or native functionality within Webpack itself.

Common errors

```
TypeError: WebpackPreBuildPlugin is not a constructor
```
cause The `WebpackPreBuildPlugin` might be incorrectly imported or the module itself is not returning a class or constructor in the expected way, especially if the `require` statement is incorrect or an old webpack version is used.

fix Ensure you are using `const WebpackPreBuildPlugin = require('pre-build-webpack');` and that Webpack is installed in your project. Verify the Webpack version you are using is compatible with such an old plugin (likely Webpack v1-v3).
```
ERROR in   Error: Cannot find module 'pre-build-webpack'
```
cause The package `pre-build-webpack` is not installed or Webpack cannot resolve its path.

fix Run `npm install --save-dev pre-build-webpack` to ensure the package is installed and available in your `node_modules` directory.

Warnings

breaking This plugin was released 8 years ago and is designed for older versions of Webpack (likely v1-v3). It is highly unlikely to be compatible with Webpack v4, v5, or v6+ without significant issues or modification.
Fix: Consider using native Webpack hooks (e.g., `compiler.hooks.beforeRun.tap` or `compiler.hooks.beforeCompile.tap`) or a more modern plugin for pre-build operations, as this plugin is deprecated by core Webpack functionality.
gotcha The documentation example shows `new WebpackPreBuildPlugin(function(stats) { ... })`. However, the `stats` object is typically generated *after* the build completes. At a 'pre-build' stage, the `compiler` instance or other pre-compilation data is usually passed. The actual argument passed to the callback might differ, or `stats` might be `undefined` or incomplete.
Fix: Always log the argument passed to the callback function (e.g., `console.log(arguments[0]);`) to verify what data is actually available at the pre-build stage for your specific Webpack version.
gotcha The package is explicitly CommonJS (`require`). Attempting to `import` it in an ES Module context will result in a `TypeError: require is not a function` or similar module resolution errors.
Fix: Ensure you are using `require('pre-build-webpack')` in a CommonJS file or configure your build system to correctly handle CJS modules within an ESM project, though this is generally not recommended for abandoned packages.
deprecated This package is effectively abandoned, with no updates in 8 years. It uses an older Webpack plugin API. Modern Webpack versions provide more robust and well-documented ways to hook into the build lifecycle, such as `compiler.hooks.beforeRun` or `compiler.hooks.beforeCompile`.
Fix: Migrate to using native Webpack hooks. For example: ```javascript // In webpack.config.js module.exports = { // ... plugins: [ { apply: (compiler) => { compiler.hooks.beforeRun.tap('MyPreBuildPlugin', (compiler) => { console.log('Native pre-build hook fired!'); // Your pre-build logic here }); }, }, ], }; ```

Install

npm install pre-build-webpack npm
yarn add pre-build-webpack yarn
pnpm add pre-build-webpack pnpm

Imports

WebpackPreBuildPlugin
wrong:
```
import { WebpackPreBuildPlugin } from 'pre-build-webpack';
```
correct:
```
const WebpackPreBuildPlugin = require('pre-build-webpack');
```
This package was developed in the CommonJS era. Attempting to use ESM import syntax will likely result in a runtime error.

Quickstart

This quickstart demonstrates how to integrate `WebpackPreBuildPlugin` into a `webpack.config.js` file, showcasing a basic pre-build logging operation.

const path = require('path');
const WebpackPreBuildPlugin = require('pre-build-webpack');

module.exports = {
  mode: 'development',
  entry: './src/index.js',
  output: {
    filename: 'bundle.js',
    path: path.resolve(__dirname, 'dist'),
  },
  plugins: [
    new WebpackPreBuildPlugin(function(compiler) {
      // This callback runs BEFORE the Webpack build starts.
      // 'compiler' is typically the Webpack Compiler instance.
      // The README example shows 'stats', but 'stats' is usually available
      // AFTER the build. It's recommended to log and inspect the argument
      // passed to understand its structure in your specific Webpack version.
      console.log('--- Pre-build Webpack Plugin Fired ---');
      console.log('Preparing build...');
      // Example: Cleanup a directory before build
      // const fs = require('fs');
      // const distPath = path.resolve(__dirname, 'dist');
      // if (fs.existsSync(distPath)) {
      //   fs.rmdirSync(distPath, { recursive: true });
      //   console.log('Cleaned ' + distPath);
      // }
      console.log('--- Pre-build tasks completed ---');
    }),
  ],
};

view raw JSON →