DEV Community

Discussion on: 📦 webpack secrets

Collapse
 
magellol profile image
Thomas Lefebvre

I usually find maintaining webpack configurations difficult. With either splitting prod and development configs or conditionally do some stuff based on an environment, that can get messy real quick.

I've been using the following for configuring some parts based on the environment for instance. I feel it has been keeping most of the config terse and easier to read.

GitHub logo kentcdodds / webpack-config-utils

Utilities to help your webpack config be easier to read

webpack-config-utils

Utilities to help your webpack config be easier to read

Build Status Code Coverage Dependencies version downloads MIT License

All Contributors PRs Welcome Donate Code of Conduct Roadmap Examples

The problem

Webpack configuration is a JavaScript object which is awesomely declarative. However, the webpack config file can easily turn into an imperative mess in the process of creating the configuration object.

This solution

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.

Installation

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

Usage

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! (Make sure you have babel-register installed.) So you could…





Collapse
 
nickytonline profile image
Nick Taylor • Edited

Thanks for sharing Thomas. 🔥 Is there anything Kent C. Dodds can't do? 😂