Registry / devops / webpack-preprocessor

webpack-preprocessor

library0.1.12jsnpmunverified

A webpack loader that strips or keeps code blocks based on preprocessor directives like `#if`, `#elif`, `#else`, `#endif`, supporting JavaScript and HTML files. It uses a declarative syntax similar to C preprocessor. Version 0.1.12 is the latest, but the project appears unmaintained (last commit years ago). Key differentiators: simple condition syntax, supports nested logic, and works with webpack 1/2 loaders. Alternatives like preprocess-loader or webpack-strip-block may be more modern.

devops

npm install webpack-preprocessor

github ↗package ↗

INSTALL

IMPORT

SIG · WEBPACK-PREPROCESS

webpack-preprocessor

devopsjavascriptv0.1.12

Install

—

Import

—

Disk

—

Pass rate

0/ 6

Env Coverage0 / 6

glibc

18–22

musl

18–22

Install & Compatibility

Where this runs

tested against v? · npm install

Install × environment matrix

Each cell = how many times install + import succeeded across repeated harness runs. Partial = flaky.
glibc = Debian/Ubuntu slim · musl = Alpine Linux

musl

node 18–226 runs

build_error

glibc

node 18–226 runs

build_error

Code

Verified usage

Verified import paths — ran on the pinned version, not inferred.

default

✓ import webpackPreprocessor from 'webpack-preprocessor'; // as webpack loader rule

✗ const webpackPreprocessor = require('webpack-preprocessor'); // works in CommonJS, but loader config uses string

Loaders are typically referenced by name in webpack config, not imported. If imported, use default.

loader

✓ { test: /\.js$/, loader: 'webpack-preprocessor' }

✗ { test: /\.js$/, use: ['webpack-preprocessor'] } // not a webpack loader function, use string form

This is a legacy loader for webpack 1-4. In webpack 5, use 'use' array with string.

query options

✓ loader: 'webpack-preprocessor?definitions=["dev","stage"]'

✗ loader: 'webpack-preprocessor?definitions=dev,stage' // must be JSON array string

Options are passed as query string. For complex values, use JSON.stringify.

Set up webpack loader config and use preprocessor directives in JS files to conditionally include code based on definitions.

// webpack.config.js module.exports = { module: { rules: [ { test: /\.js$/, exclude: /node_modules/, use: [ { loader: 'webpack-preprocessor', options: { definitions: ['dev'] } } ] } ] } }; // In source: /*#if dev*/ console.log('development build'); /*#endif*/

Debug

Known issues

deprecatedwebpack-preprocessor uses legacy webpack loader API (v1/v2), not compatible with webpack 5 pipeline.

fix

Use a modern loader like preprocess-loader or write inline loaders.

affects: >=0.1.12

gotchaComplex condition expressions with both && and || operators are not supported; only simple conjunctions or disjunctions work.

fix

Use nested conditions or chain multiple #if directives.

affects: >=0.1.0

gotchaThe loader expects definitions as a JSON array string. Non-serialized string will cause runtime errors.

fix

Pass definitions as valid JSON array: definitions='["dev","stage"]'

affects: >=0.1.0

deprecatedNo updates since 2015; project is effectively abandoned.

fix

Consider migrating to an actively maintained alternative.

affects: >=0.1.12

Errors

Common errors & fixes

Error: Cannot find module 'webpack-preprocessor'

Package not installed or not in node_modules.

fix

Run `npm install webpack-preprocessor --save-dev`.

Module build failed: Error: 'definitions' must be a valid JSON array

The query string options are not properly JSON-encoded.

fix

Use `?definitions='["dev"]'` or use options object with webpack 4+.

Upgrade

Version history

0.1.12latest on npm

Audit

Dependencies

webpackrequiredruns as a webpack loader, requires webpack build system

Agent activity

16 hits · last 30 days

node

Anthropic

Resources

githubhttps://github.com/Marc-Andre-Rivet/webpack-preprocessor ↗

packagehttps://www.npmjs.com/package/webpack-preprocessor ↗