config-reducer
One config file for development, test and production. ✨
Useful when you want to have simplicity your configuration pipeline.
Work with a webpack-merge.
A picture is worth a thousand words:
Example 1 (trivial)
{
development: { // <--
stats: {
colors: true,
},
},
module: {},
plugins: [],
}
Output for process.env.NODE_ENV === 'development':
{
stats: {
colors: true,
},
module: {},
plugins: [],
}
Output for process.env.NODE_ENV === 'production':
{
module: {},
plugins: [],
}
Example 2 (webpack.config.js)
{
development: { // <--
stats: {
colors: true,
warnings: true,
},
},
module: {
rules: [
{
include: [paths.dir.app],
use: [
{
loader: 'css-loader',
options: {
modules: true,
development: { // <--
minimize: false,
},
}
},
],
},
],
},
plugins: [
new Dotenv(config.dotenv),
{development: () => { // <--
const HardSourceWebpackPlugin = require('hard-source-webpack-plugin')
return [
new HardSourceWebpackPlugin(),
]
}},
{production: [ // <--
new webpack.optimize.OccurrenceOrderPlugin(),
new webpack.HashedModuleIdsPlugin(),
]},
],
}
Output for process.env.NODE_ENV === 'development':
{
stats: {
colors: true,
warnings: true,
},
module: {
rules: [
{
include: [paths.dir.app],
use: [
{
loader: 'css-loader',
options: {
modules: true,
minimize: false,
}
},
],
},
],
},
plugins: [
new Dotenv(config.dotenv),
new HardSourceWebpackPlugin(),
],
}
Example 3 (babel.config.js)
{
presets: ['@babel/preset-env'],
plugins: [
[
'emotion',
{
hoist: true,
development: { // <--
sourceMap: true,
hoist: false,
},
},
],
'react-hot-loader/babel',
{development: ['@babel/plugin-transform-react-jsx-source']}, // <--
{production: [ // <--
'transform-react-remove-prop-types',
]},
],
}
Output for process.env.NODE_ENV === 'production':
{
presets: ['@babel/preset-env'],
plugins: [
[
'emotion',
{
hoist: true,
},
],
'react-hot-loader/babel',
'transform-react-remove-prop-types',
],
}
Installation
$ npm install config-reducer
or
$ yarn add config-reducer
Usage
Copy and paste ;)
const devProdReducer = moduleexports =
API
Import variants:
default
const configReducer = default const commonConfig = development: stats: colors: true warnings: true // ... config -> go to example 2 const result =
const configReducer = default module { const babelConfig = presets: '@babel/preset-env' '@babel/preset-react' // ... config -> go to example 3 return }
devReducer
const devReducer = moduleexports =
prodReducer
const prodReducer =
testReducer
const testReducer =
devProdReducer
const devProdReducer = moduleexports =
devTestReducer
const devTestReducer =
prodTestReducer
const prodTestReducer =
devProdTestReducer
const devProdTestReducer =
Parameters:
Module steps:
- find and prepare (deep duplicate) -
input
- apply to parent -
reducer
- delete references -
cleanup
input
Type: Object|Array
Required: true
Your configuration object or array variants:
[{ development: [] }]
{{ development: {} }}
[{ development: () => [] }]
The function warrant is intended to be postponed until the configurations are reduced. Thanks to this, we do not have to import modules from which we do not use:
1 Install module for development mode
$ yarn add --dev hard-source-webpack-plugin
2 Configuration
plugins: configdotenv { const HardSourceWebpackPlugin = return }
3 Compile production version - work fine, without hard-source-webpack-plugin
$ yarn prod
Useful in Dockerfile.
{{ development: () => {} }}
reducer
Type: string
Default: process.env.NODE_ENV
This key will be merged.
cleanup
Type: boolean|string|Array<string>
Default: true
These keys will be deleted.
- false: do nothing
- true: delete reducer
- string: delete key
- array of strings: delete keys
Real examples
TODO
- array/object reducer
- reducer in reducer / nested reducers
- alias ex: test = _test
Issues
If you find a bug, please file an issue on issue tracker on GitHub.
License
MIT