@rock-kit/ui-webpack-config v0.1.1

category: packages

ui-webpack-config

A shared webpack config made by Rock Content.

Installation

yarn add @rock-kit/ui-webpack-config

Usage

In your Webpack config file:

/* webpack.config.js */
const baseConfig = require('@rock-kit/ui-webpack-config')
module.exports = {
  ...baseConfig,
  plugins: [ ...baseConfig.plugins, ...myPlugins ],
  module: {
    // note: put your rules first
    rules: [ ...myModuleRules, ...baseConfig.module.rules ]
  },
  resolveLoader: {
    alias: { ...baseConfig.resolveLoader.alias, ...myLoaderAliases }
  }
}

Themeable Components

If your application already has a babel config and webpack config, and it is costly to convert fully to the shared webpack config, you can introduce themeable components incrementally by adding the appropriate loader and resolve loader to your existing webpack config.

/* webpack.config.js */
module.exports = {
  module: {
    rules: [
      {
        test: /\.css$/,
        exclude: [/node_modules/],
        use: [
          'babel-loader',
          'themeable-css-loader',
          'postcss-loader'
        ]
      }
    ]
  },
  resolveLoader: {
    alias: require('@rock-kit/ui-webpack-config').resolveLoader.alias
  }
}