Webpack Recipes

Modular and pluggable command line for compiling and running webpack builds.

The webpack-recipes only creates a structure to assist in creating a build with a webpack configuration, making the setup of your project almost zero. Gaining agility with fewer settings at the time you start coding, test, create a folder, and start a project with a single command:

curl -L https://git.io/vhWby | bash

Recipes

Recipes are modules that configure a specific part of the webpack build, which can be combined with other recipes.

Structure

The Recipe should have 2 exports (recipe and webpackConfig)

module.exports.recipe

name: Recipe name
version: Recipe version
description: Recipe description
command: command line definitions (learn more at https://github.com/yargs/yargs/blob/master/docs/advanced.md#providing-a-command-module)


module.exports.recipe = {
  name: 'devserver',
  version: '0.0.1',
  description: 'Webpack Dev Server',
  command
};

module.exports.webpackConfig

The webpackConfig method must be exported as a function that recives argv command line parameters and returning a webpack configuration object. (learn more at https://webpack.js.org/configuration/)


module.exports.webpackConfig = function (argv) {
  return {
    mode: 'development',

    devServer: {
      historyApiFallback: true,
      stats: 'minimal',
      port: argv.port,
      inline: argv.inline,
      contentBase: argv['content-base'],
      watchOptions: { aggregateTimeout: 300, poll: 1000 },
    },
  }
};

Examples

Simple recipe example (app): https://github.com/joaoneto/webpack-recipes-example

DevServer recipe (plugin): https://github.com/joaoneto/webpack-recipes-devserver

ES6 minimum build recipe (plugin): https://github.com/joaoneto/webpack-recipes-es6