0.0.10 • Published 4 years ago

webpack-config-util v0.0.10

Weekly downloads
1
License
MIT
Repository
github
Last release
4 years ago

webpack-config-utils

The Problem

Declarative configuration is great but the learning cost is high for the majority of folk. Sometimes you just want to create a webpack config with a few options and then sprinkle on a few settings.

The Solution

Webpack config util offers 2 methods to create the perfect config:

🛠 Create Config:

We expose a function createConfig which is what you'll need to create a ready-to-go config.

Its options are intuitive yet support a wide range of scenarios including node/web, dev servers or even logging of emitted bundle sizes

Full list of options here

🩹 Plugins:

A grab bag of imperative "plugins" that understand the config they're operating on. Just stack them up according to your use case

We have found for our projects this really helps with auditing what it is we want our bundler to actually do for us. It's far too easy for codebases and bundler configs to get out of sync

The plugins are also compatible with next plugins although tend to be a little lower level

Installation

This module is distributed via npm which is bundled with node and should be installed as one of your project's devDependencies:

yarn add -D @peartree/webpack-config-util

Usage

This example uses typescript configuration but feel free to use a webpack.config.js file

// webpack.config.ts
import {plugins, getDevPackagesPaths, compose, createConfig} from '@peartree/webpack-config-util'

const composedPlugins = compose(
  plugins.mainFields(['ts', 'tsx', 'js']),
  plugins.whitelistAllPackages(),
)

const config = composedPlugins(createConfig({}))

export default config

Again, this assumes a webpack.config.ts. For JS configs, drop the TS_NODE_FILES env

// package.json
{
  ...
  "scripts": {
    "dev": "NODE_ENV=development TS_NODE_FILES=true build-webpack-development --verbose",
    "build": "NODE_ENV=production TS_NODE_FILES=true build-webpack-production"
  }
}

Command line docs are here

Options

parameterweb/nodedefaulttypedescription
nodeBundlenodeindexstringthe name of the bundle file
buildDirnodediststringwhere the bundle will be output to
hostnodelocalhoststringwhere the bundle will be output to
portnode3000numberwhere the bundle will be output to
serverEntryPointweb & node(src/)index.jsstringentry point relative to ./src directory
hotModuleReplacementwebtruebooleanwhether to apply the hot module replacement plugin
modeweb & noderequired'development' or 'production'defines whether webpack will operate in dev mode. Note this is distinct from NODE_ENV
targetweb & noderequired'web' or 'node'defines the target platform target

Command Line

parameterdescription
verboselogs the full config to the console

Plugins

TBD. You can check them all here

Contributing

This package is part of a monorepo. Please see here for details of how to contribute.

The project follows the all-contributors specification. Contributions of any kind welcome!