preprocess-loader

preprocess-loader for webpack

> Webpack loader uses preprocess to preprocess HTML, Javascript, and other module files based on custom or environment configurations.
>
> Inspired by gulp-preprocess and coffee-loader.

Usage

This loader is used within loader-chain before other loaders doing 'real' job.

``
var exports = require('coffee!preprocess?+DEBUG&NODE_ENV=production!./file.coffee')

`

Webpack Doc: Using Loaders

#### loadUtils.parseQuery examples

`
null -> {}
? -> {}
?flag -> { flag: true }
?+flag -> { flag: true }
?-flag -> { flag: false }
?xyz=test -> { xyz: "test" }
?xyz[]=a -> { xyz: ["a"] }
?flag1&flag2 -> { flag1: true, flag2: true }
?+flag1,-flag2 -> { flag1: true, flag2: false }
?xyz[]=a,xyz[]=b -> { xyz: ["a", "b"] }
?a%2C%26b=c%2C%26d -> { "a,&b": "c,&d" }
?{json:5,data:{a:1}} -> { json: 5, data: { a: 1 } }
`

#### webpack.config file

##### Webpack 2+ (Thanks @scholtzm)
` javascript
const config = {
module: {
loaders: [
{
test: /\.js$/,
use: [
{
loader: 'preprocess-loader',
options: {
foo: true,
bar: 'baz'
ppOptions: {
type: 'js'
}
}
}
]
}
]
}
};
`

##### Webpack 1
` coffeescript
{
module: {
loaders: [{
test: /\.coffee$/
loader: 'coffee!preprocess?+DEBUG&NODE_ENV=production'
}, {
test: /\.cjsx$/
loader: 'coffee!cjsx!preprocess?+DEBUG&NODE_ENV=production'
}, {
test: /\.test_pp_options$/
loader: "coffee!cjsx!preprocess?{DEBUG:true,ppOptions:{type:'cjsx'}}"
}, {
test: /\.js$/
loader: 'babel-loader!preprocess?+DEBUG'
}]
}
}
`

Loader supports .cjsx as an alias type of .coffee.

You can override default preprocess options by passing ppOptions object in query. See preprocess API for available options.

#### Example HTML

` html