razzle-config-utils

razzle-config-utils is a set of utilities for razzle.config.js

If there's a snippet of code that you keep reusing in your own razzle config, consider sending a pull request!

API

Plugins

getPluginIndex

Retrieves plugin's index in webpack configuration or returns null

Parameters

• config Object webpack configuration
• name string Plugin name

Returns (number | null)

isPluginLoaded

Checks if plugin is loaded

Parameters

• config Object webpack configuration
• name string Plugin name

Returns boolean

modifyPlugin

Modifies webpack plugin in place.

Parameters

• config Object webpack configuration
• name string Plugin name
• fn modifyPluginFn

Examples

modifyPlugin(appConfig, 'StartServerPlugin', (plugin) => {
      plugin.options.nodeArgs = ['--inspect']
    })

• Throws any an exception if it cannot find requested plugin

Returns any result of the callback

replacePlugin

Replaces webpack plugin. If the plugin cannot be found, it's ignored.

Parameters

• config Object webpack configuration
• name string Plugin name
• plugin
• fn modifyPluginFn

Examples

replacePlugin(appConfig, 'UglifyJsPlugin', new MinifyPlugin())

Returns any plugin

Rules

getRuleIndexByTest

Retrieves rule's index in webpack configuration by test property

Parameters

• config Object webpack configuration
• test string exact value of test property

Returns (number | null)

getRuleIndexByLoader

Retrieves rule's index in webpack configuration by loader. Returns first found result.

Parameters

• config Object webpack configuration
• loaderName
• loader string loader name

Returns (number | null)

modifyRule

Modifies webpack rule in place. You can pass either test property (ex. { test: /\.css$/ }) or loader (ex. { loader: 'css-loader' })` to the second argument.

Parameters

• config Object webpack configuration
• rule Object webpack rule
  • rule.test (string | RegExp) rule's test property
  • rule.loader string rule's loader
• fn modifyRuleFn

Examples

modifyRule(appConfig, { test: /\.css$/ }, (rule) => {
      rule.test = /\.s?css/
      rule.use.push({ loader: 'scss-loader' })
    })

• Throws any an exception if it cannot find requested rule

Returns any result of the callback

replaceRule

Replaces webpack rule. You can pass either test property (ex. { test: /\.css/ }) or loader (ex. { loader: 'css-loader' })` to the second argument. If the rule cannot be found, it's ignored.

Parameters

• config Object webpack configuration
• $1 Object
  • $1.test
  • $1.loader
• rule
• fn modifyRuleFn

Examples

replaceRule(appConfig, { test: /\.css$/ }, {
      test: /\.s?css/,
      use: [
        // ... etc
      ]
    })

Returns any rule

ignoreFileExtension

Adds file extension to the list of extensions ignored by file-loader This is useful if you're adding support for something that Razzle does not support yet (SASS/Less, Handlebars, you name it)

Parameters

• config Object webpack configuration
• extension RegExp file extension
• fn modifyRuleFn

Examples

ignoreFileExtension(appConfig, /\.hbs$/)

Returns any rule

modifyPluginFn

Function that will be invoked with found plugin

Type: Function

Parameters

• plugin Object
• plugin number 's index

modifyRuleFn

Function that will be invoked with found rule.

Type: Function

Parameters

• rule Object
• rule number 's index