@skilld/webpack-drupal-breakpoints-loader v1.0.1

webpack-drupal-breakpoints-loader

npm install @skilld/webpack-drupal-breakpoints-loader

THEMENAME.mobile:
  label: mobile
  mediaQuery: 'all and (max-width: 639px)'
  weight: 0
  group: THEMENAME
  multipliers:
    - 1x
    - 2x
THEMENAME.narrow:
  label: narrow
  mediaQuery: 'all and (min-width: 640px) and (max-width: 1023px)'
  weight: 1
  group: THEMENAME
  multipliers:
    - 1x
    - 2x
THEMENAME.wide:
  label: wide
  mediaQuery: 'all and (min-width: 1024px)'
  weight: 2
  group: THEMENAME
  multipliers:
    - 1x
    - 2x

    rules: [
      {
        test: /\.yml$/,
        use: [
          {
            loader: 'breakpoints-loader',
          },
        ],
      },
      ...

const config = require('path-to-your-THEMENAME.breakpoints.yml');

https://github.com/skilld-labs/kaizen/blob/master/src/js/breakpoints.js#L14