webpack-conditional-loader

Inspired by C conditionals directive,
conditional loader decides if a given block should be included in the final bundle.

Useful for removing instrumentation code and making your final production bundle smaller (therefore
faster).

Installation

``bash
npm install --save-dev webpack-conditional-loader
`

Usage

$3

Put webpack-conditional-loader as the last loader in the array, so it will process the code before
all others.

`js
module: {
rules: [{
test: /\.js$/,
use: ['babel-loader', 'webpack-conditional-loader']
}]
}
`

Get an example config file here

$3

Use // #if expression and // #endif to wrap blocks of code you want to be removed if a given
predicate is false.

`js
// #if process.env.NODE_ENV === 'DEVELOPMENT'
console.log('lorem')
console.log('ipsum')
// #endif
`

In the example above, the code will be removed if the enviroment variable NODE_ENV is not
DEVELOPMENT, removing unnecessary code from your production bundle.

The same technique can be used to prevent loading packages in the production bundle.

`js
// #if process.env.NODE_ENV !== 'BUILD'
import reduxLogger from 'redux-logger'
// #endif
``

Credits

- GCC C conditional documentation

---

caiogondim.com  · 
GitHub @caiogondim  · 
Twitter @caio_gondim