dev-utils

Includes helpers for working with dual webpack instances. Modified from CRA.

Entry Points

There is no single entry point. You can only import individual top-level modules.

logger

• logger.log(thing: any): void: Log to console. = console.log
• logger.start(text: string): void: Log the start of a task to console
• logger.done(text: string): void: Log the end of task to console
• logger.info(text: string, data: object): void: Log information and data to console
• logger.debug(text: string, data: object): void: Log debug message and data to console
• logger.warn(text: string, data: object): void: Log a warning with message and data to console
• logger.error(text: string, err: object): void: Log a message and an error to console

new FriendlyErrorrWebpackPlugin({ verbose: boolean, onSuccessMessage: string, target: 'web' | 'server' })

This will pretty print webpack errors to your console. It is mean to be used with a double webpack setup, where you have two webpack instances running in parallel. Otherwise the output looks almost identical to create-react-app's as it uses the same error formatter under the hood.

const FriendlyErrorsPlugin = require('@starlightpro/dev-utils/FriendlyErrorsPlugin');

module.exports = {
  // ...
  plugins: [
    new FriendlyErrorsPlugin({
        verbose: false,
        target: 'web'
        onSuccessMessage: `Your application is running at http://${process.env.HOST}:${process.env.PORT}`,
      }),
    // ...
  ],
  // ...
}

printErrors(summary: string, errors: Error[])

Pretty print an array of errors with a message. Good for CI's.

const printErrors = require('@starlightpro/dev-utils/printErrors');

try {
  // do something
} catch (e) {
  printErrors('Failed to compile.', [e]);
}

makeLoaderFinder(loaderName: string): (rule: WebPackRule) => boolean;

Helper function to find a loader in the webpack config object.

Example:

// app.config.js
const loaderFinder = require('@starlightpro/dev-utils/makeLoaderFinder');

module.exports = {
  modify(config) {
    // Makes a finder function, to search for babel-loader
    const babelLoaderFinder = makeLoaderFinder('babel-loader');

    // Finds the JS rule containing babel-loader using our function
    const jsRule = config.module.rules.find(babelLoaderFinder);

    // Set cacheDirectory to true in our babel-loader
    jsRule.use.find(babelLoaderFinder).options.cacheDirectory = true;
  }
}