Product
Introducing License Enforcement in Socket
Ensure open-source compliance with Socket’s License Enforcement Beta. Set up your License Policy and secure your software!
webpack-config-utils
Advanced tools
Utilities to help your webpack config be easier to read
Webpack configuration is a JavaScript object which is awesomely declarative. However, often the webpack config file is can easily turn into an imperative mess in the process of creating the configuration object.
The goal of this project is to provide utilities to make it easier to compose your config object so it's easier for people to read. It has some custom methods and also comes bundled with some other projects to expose some helpful utility functions.
This module is distributed via npm which is bundled with node and should
be installed as one of your project's devDependencies
:
npm install --save-dev webpack-config-utils
It is expected that you use this in your webpack.config.js
file.
Protip: You can name your config file
webpack.config.babel.js
and it'll be automagically transpiled! So you could use ES6 module imports rather than CommonJS requires. But this example will stick to CommonJS because we love you ❤️
const webpack = require('webpack')
const {getIfUtils, removeEmpty} = require('webpack-config-utils')
const {ifProduction} = getIfUtils(process.env.NODE_ENV)
module.exports = {
// ... your config
plugins: removeEmpty([
ifProduction(new webpack.optimize.DedupePlugin()),
ifProduction(new webpack.LoaderOptionsPlugin({
minimize: true,
quiet: true,
})),
ifProduction(new webpack.DefinePlugin({
'process.env': {
NODE_ENV: '"production"',
},
})),
ifProduction(new webpack.optimize.UglifyJsPlugin({
compress: {
screw_ie8: true,
warnings: false,
},
})),
new HtmlWebpackPlugin({
template: './index.html',
inject: 'head',
}),
ifProduction(new OfflinePlugin()),
]),
}
Then you'd invoke the webpack config with cross-env
in your package.json
scripts (or with
p-s
):
{
// your package.json stuff
scripts: {
"build:dev": "cross-env NODE_ENV=development webpack",
"build:prod": "cross-env NODE_ENV=production webpack"
}
}
Things get even better with webpack 2 because you can write your webpack config as a function that accepts an env
argument which you can set on the command line (which means you don't need cross-env
👍).
const webpack = require('webpack')
const {getIfUtils, here} = require('webpack-config-utils')
module.exports = env => {
const {ifDev} = getIfUtils(env)
return {
output: {
// etc.
pathinfo: ifDev(),
path: here('dist'),
},
// etc.
}
}
See the API Documentation here. In addition to custom utilities from this package, it comes bundled with
a few another helpful utility: webpack-combine-loaders
(exposed as combineLoaders
).
Thanks goes to these people (emoji key):
Kent C. Dodds 💻 📖 💡 🚇 ⚠️ |
---|
This project follows the all-contributors specification. Contributions of any kind welcome!
MIT
FAQs
Utilities to help your webpack config be easier to read
The npm package webpack-config-utils receives a total of 5,772 weekly downloads. As such, webpack-config-utils popularity was classified as popular.
We found that webpack-config-utils demonstrated a not healthy version release cadence and project activity because the last version was released a year ago. It has 1 open source maintainer collaborating on the project.
Did you know?
Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.
Product
Ensure open-source compliance with Socket’s License Enforcement Beta. Set up your License Policy and secure your software!
Product
We're launching a new set of license analysis and compliance features for analyzing, managing, and complying with licenses across a range of supported languages and ecosystems.
Product
We're excited to introduce Socket Optimize, a powerful CLI command to secure open source dependencies with tested, optimized package overrides.