public class | source

ConfigurationBuilder

The configuration builder class

Constructor Summary

Public Constructor
public	constructor()

Method Summary

Public Methods
public	alias(aliases: object): ConfigurationBuilder Define aliases
public	build(): object Returns a plain JavaScript object representing the built Webpack configuration
public	dest(dir: string, chunkhash: boolean): ConfigurationBuilder Set the output directory
public	devServer(opts: Object): ConfigurationBuilder Turns on overlay and optional proxy
public	development(enable: boolean): ConfigurationBuilder Specify whether or not to generate development configuration
public	extensions(ext: ...string): ConfigurationBuilder Add resolvable extensions (ex: '.jsx', '.css')
public	externals(depsOrFiles: string \| string[], moduleType: string): * Exclude certain modules/files from the bundle
public	loader(ext: string \| Array<string>, loader: string \| Array<string>, query: object): ConfigurationBuilder Add a loader
public	merge(cfgs: ...object): ConfigurationBuilder Merge configuration using `webpack-merge`
public	plugins(plugins: ...object): ConfigurationBuilder Add plugins
public	production(enable: boolean): ConfigurationBuilder Specify whether or not to generate production configuration
public	src(globs: ...string): ConfigurationBuilder Set entry/entries based on glob(s)
public	vendor(modules: ...string): ConfigurationBuilder Specify vendor modules

Public Constructors

public constructor() source

Public Methods

public alias(aliases: object): ConfigurationBuilder source

Define aliases

Params:

Name	Type	Attribute	Description
aliases	object		The alias specifications

Return:

ConfigurationBuilder

Example:

// webpack.config.js
module.exports = builder()
  .alias({
    'react': 'inferno-compat',
    'react-dom': 'inferno-compat',
  })
  .build()

See:

https://webpack.js.org/configuration/resolve/#resolve-alias

public build(): object source

Returns a plain JavaScript object representing the built Webpack configuration

Return:

object

Example:

// webpack.config.js
module.exports = builder()
  .build()

public dest(dir: string, chunkhash: boolean): ConfigurationBuilder source

Set the output directory

Params:

Name	Type	Attribute	Description
dir	string		The output directory; this path may be relative or absolute
chunkhash	boolean	default: true	Whether to include [chunkhash] in the filename

Return:

ConfigurationBuilder

Example:

// webpack.config.js
module.exports = builder()
  .dest('build/public/js', false)
  .build()

public devServer(opts: Object): ConfigurationBuilder source

Turns on overlay and optional proxy

Params:

Name	Type	Attribute	Description
opts	Object		(plus optional 'proxy' options to be passed to 'http-proxy')

Return:

ConfigurationBuilder

Example:

// webpack.config.js
module.exports = builder()
  .devServer({
    publicPath: '/js/',
    proxy: {
      target: 'https://localhost:8443/',
      secure: false,
    },
  })
  .build()

public development(enable: boolean): ConfigurationBuilder source

Specify whether or not to generate development configuration

Params:

Name	Type	Attribute	Description
enable	boolean		Whether or not to enable development mode

Return:

ConfigurationBuilder

Example:

// webpack.config.js
module.exports = builder()
  .development((process.env.NODE_ENV || 'development') == 'development')
  .build()

public extensions(ext: ...string): ConfigurationBuilder source

Add resolvable extensions (ex: '.jsx', '.css')

Params:

Name	Type	Attribute	Description
ext	...string		The extensions to add

Return:

ConfigurationBuilder

Example:

// webpack.config.js
module.exports = builder()
  .extensions('.js', '.jsx', '.ts', '.css', '.less', '.scss')
  .build()

See:

https://webpack.js.org/configuration/resolve/#resolve-extensions

public externals(depsOrFiles: string | string[], moduleType: string): * source

Exclude certain modules/files from the bundle

Params:

Name	Type	Attribute	Description
depsOrFiles	string \| string[]		The array of files/module to exclude
moduleType	string		see: https://webpack.js.org/configuration/externals/#externals

Return:

Example:

module.exports = builder()
  .externals(Object.keys(require('./package').dependencies))
  .build()

// Exclude specific file:

module.exports = builder()
  // Note how we are using 'config/index' and not 'config/index.js'
  // Be sure to match exactly how you are requiring/importing the file
  // For example, if you require the file with `require('./config/index')`
  // then exclude 'config/index' (without extension).  However if your code
  // looks like `require('./config/index.js')`, then exclude 'config/index.js'
  .externals(path.resolve('config/index'))
  .build()

public loader(ext: string | Array<string>, loader: string | Array<string>, query: object): ConfigurationBuilder source

Add a loader

Params:

Name	Type	Attribute	Description
ext	string \| Array<string>		The file extensions to match
loader	string \| Array<string>		The loader spec
query	object	nullable: true	The loader parameters

Return:

ConfigurationBuilder

Example:

// webpack.config.js
module.exports = builder()
  .loader(['.js', '.jsx'], 'babel-loader', {
    presets: ['latest', 'react'],
  })
  .build()

See:

https://webpack.js.org/configuration/module/#module-rules

public merge(cfgs: ...object): ConfigurationBuilder source

Merge configuration using webpack-merge

Params:

Name	Type	Attribute	Description
cfgs	...object		The configurations to merge

Return:

ConfigurationBuilder

Example:

// webpack.config.js
module.exports = builder()
  .merge({
    resolve: {
      modules: ['node_modules'],
    },
  })
  .build()

See:

https://github.com/survivejs/webpack-merge

public plugins(plugins: ...object): ConfigurationBuilder source

Add plugins

Params:

Name	Type	Attribute	Description
plugins	...object		The plugins to add

Return:

ConfigurationBuilder

Example:

// webpack.config.js
module.exports = builder()
  .plugins(new Plugin1(), new Plugin2())
  .build()

public production(enable: boolean): ConfigurationBuilder source

Specify whether or not to generate production configuration

Params:

Name	Type	Attribute	Description
enable	boolean		Whether or not to enable production mode

Return:

ConfigurationBuilder

Example:

// webpack.config.js
module.exports = builder()
  .production(process.env.NODE_ENV == 'production')
  .build()

public src(globs: ...string): ConfigurationBuilder source

Set entry/entries based on glob(s)

Params:

Name	Type	Attribute	Description
globs	...string		The file globs

Return:

ConfigurationBuilder

Example:

// webpack.config.js
module.exports = builder()
  .src('src/*.js')
  .build()

public vendor(modules: ...string): ConfigurationBuilder source

Specify vendor modules

Params:

Name	Type	Attribute	Description
modules	...string		The vendor modules

Return:

ConfigurationBuilder

Example:

// webpack.config.js
module.exports = builder()
  .vendor('react', 'react-dom', ...)
  .build()