-
#extend()
- Helps to extend config using local file or shareable config -
#merge()
- Helps to merge some values into config and overrides existing ones -
#defaults()
- Helps to add some values if they are missing - Supports
environment
variables under#extend()
,#merge()
,#defaults()
methods - Supports
process.env.*
variables in addition toenvironment
ones - Supports shareable configs via
node
-modules
Details changes for each release are documented in the release notes and also in the wiki page.
You can publish your configs to npm
using webpack-config-
prefix for package name.
When you call #extend()
method you may omit that prefix:
import Config from 'webpack-config';
export default new Config().extend(
'mdreizin/base',
'mdreizin/css',
'mdreizin/html',
'webpack-config-mdreizin/json'
// etc
);
Also I would recommend to add webpack
and webpack-config
keywords so other users can easily find your module.
./webpack.config.js
import Config, { environment } from 'webpack-config';
environment.setAll({
env: () => process.env.NODE_ENV
});
// Also you may use `'conf/webpack.[NODE_ENV].config.js'`
export default new Config().extend('conf/webpack.[env].config.js');
./conf/webpack.base.config.js
import ExtractTextPlugin from 'extract-text-webpack-plugin';
import Config from 'webpack-config';
const extractCss = new ExtractTextPlugin('[name].css');
export default new Config().merge({
output: {
filename: '[name].js'
},
resolve: {
root: [
__dirname
],
modulesDirectories: [
'node_modules'
]
},
plugins: [
extractCss
],
module: {
loaders: [{
test: /\.less$/,
loader: extractCss.extract('style', [
'css',
'less'
])
}]
}
});
./conf/webpack.development.config.js
import webpack from 'webpack';
import Config from 'webpack-config';
export default new Config().extend('conf/webpack.base.config.js').merge({
filename: __filename,
debug: true,
devtool: '#source-map',
output: {
pathinfo: true
},
entry: {
app: [
'src/index.js',
'src/index.less'
],
vendor: [
'lodash'
]
},
plugins: [
new webpack.optimize.CommonsChunkPlugin('vendor', 'vendor.js')
]
});
./conf/webpack.production.config.js
import webpack from 'webpack';
import Config from 'webpack-config';
export default new Config().extend({
'conf/webpack.development.config.js': config => {
delete config.debug;
delete config.devtool;
delete config.output.pathinfo;
return config;
}
}).merge({
filename: __filename,
plugins: [
new webpack.optimize.DedupePlugin(),
new webpack.optimize.OccurrenceOrderPlugin(true),
new webpack.optimize.UglifyJsPlugin({
mangle: true,
output: {
comments: false
},
compress: {
warnings: false
}
})
]
});