Skip to content
Latchkey LogoLatchkey home

mini-css-extract-plugin workflow (webpack/mini-css-extract-plugin)

The mini-css-extract-plugin workflow from webpack/mini-css-extract-plugin, explained and optimized by Latchkey.

Source: webpack/mini-css-extract-plugin.github/workflows/nodejs.ymlLicense MITView source
C
CI health grade
56/100
Health score
3
Jobs per trigger
3
Fixes in the optimized version

In short

  1. CI health: C (fair)
  2. The optimized version below points runs-on at Latchkey managed runners and adds run de-duplication and job timeouts.

What it does

This is the mini-css-extract-plugin workflow from the webpack/mini-css-extract-plugin repository, a real project running GitHub Actions. It is shown here with attribution under its MIT license.

Below, Latchkey shows a faster, safer version produced by its optimization engine.

The workflow

workflow (.yml)
name: mini-css-extract-plugin

on:
  push:
    branches:
      - main
      - next
  pull_request:
    branches:
      - main
      - next

permissions:
  contents: read

jobs:
  lint:
    name: Lint - ${{ matrix.os }} - Node v${{ matrix.node-version }}

    env:
      GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}

    strategy:
      matrix:
        os: [ubuntu-latest]
        node-version: [lts/*]

    runs-on: ${{ matrix.os }}

    concurrency:
      group: lint-${{ matrix.os }}-v${{ matrix.node-version }}-${{ github.ref }}
      cancel-in-progress: true

    steps:
      - uses: actions/checkout@v4
        with:
          fetch-depth: 0

      - name: Use Node.js ${{ matrix.node-version }}
        uses: actions/setup-node@v4
        with:
          node-version: ${{ matrix.node-version }}
          cache: "npm"

      - name: Install dependencies
        run: npm ci

      - name: Lint
        run: npm run lint

      - name: Build types
        run: npm run build:types

      - name: Check types
        run: if [ -n "$(git status types --porcelain)" ]; then echo "Missing types. Update types by running 'npm run build:types'"; exit 1; else echo "All types are valid"; fi

      - name: Security audit
        run: npm run security

      - name: Validate PR commits with commitlint
        if: github.event_name == 'pull_request'
        run: npx commitlint --from ${{ github.event.pull_request.head.sha }}~${{ github.event.pull_request.commits }} --to ${{ github.event.pull_request.head.sha }} --verbose

  test:
    name: Test - ${{ matrix.os }} - Node v${{ matrix.node-version }}, Webpack ${{ matrix.webpack-version }}

    strategy:
      matrix:
        os: [ubuntu-latest, windows-latest, macos-latest]
        node-version: [12.x, 14.x, 16.x, 18.x, 20.x, 22.x, 24.x]
        webpack-version: [latest]

    runs-on: ${{ matrix.os }}

    concurrency:
      group: test-${{ matrix.os }}-v${{ matrix.node-version }}-${{ matrix.webpack-version }}-${{ github.ref }}
      cancel-in-progress: true

    steps:
      - name: Setup Git
        if: matrix.os == 'windows-latest'
        run: git config --global core.autocrlf input

      - uses: actions/checkout@v4
      - uses: actions/github-script@v7
        id: calculate_architecture
        with:
          result-encoding: string
          script: |
            if ('${{ matrix.os }}' === 'macos-latest' && ('${{ matrix['node-version'] }}' === '12.x' || '${{ matrix['node-version'] }}' === '14.x')) {
              return "x64"
            } else {
              return ''
            }
      - name: Use Node.js ${{ matrix.node-version }}
        uses: actions/setup-node@v4
        with:
          node-version: ${{ matrix.node-version }}
          architecture: ${{ steps.calculate_architecture.outputs.result }}
          cache: "npm"

      - name: Install dependencies (old Node.js version)
        run: |
          rm package-lock.json
          npm install --ignore-engines --ignore-scripts
          npm install -D typescript@4
        if: matrix.node-version == '12.x' || matrix.node-version == '14.x' || matrix.node-version == '16.x' || matrix.node-version == '18.x'

      - name: Install dependencies
        run: npm ci
        if: matrix.node-version == '20.x' || matrix.node-version == '22.x' || matrix.node-version == '24.x'

      - name: Install webpack ${{ matrix.webpack-version }}
        if: matrix.webpack-version != 'latest'
        run: npm i webpack@${{ matrix.webpack-version }}

      - name: Run tests for webpack version ${{ matrix.webpack-version }}
        run: npm run test:coverage -- --ci

      - name: Submit coverage data to codecov
        uses: codecov/codecov-action@v5
        with:
          token: ${{ secrets.CODECOV_TOKEN }}

  test-old-api:
    name: Test - ${{ matrix.os }} - Node v${{ matrix.node-version }}, Webpack latest, old API

    strategy:
      matrix:
        os: [ubuntu-latest, windows-latest, macos-latest]
        node-version: [12.x, 14.x, 16.x, 18.x, 20.x, 22.x, 24.x]

    runs-on: ${{ matrix.os }}

    steps:
      - name: Setup Git
        if: matrix.os == 'windows-latest'
        run: git config --global core.autocrlf input

      - uses: actions/checkout@v4
      - uses: actions/github-script@v7
        id: calculate_architecture
        with:
          result-encoding: string
          script: |
            if ('${{ matrix.os }}' === 'macos-latest' && ('${{ matrix['node-version'] }}' === '12.x' || '${{ matrix['node-version'] }}' === '14.x')) {
              return "x64"
            } else {
              return ''
            }
      - name: Use Node.js ${{ matrix.node-version }}
        uses: actions/setup-node@v4
        with:
          node-version: ${{ matrix.node-version }}
          architecture: ${{ steps.calculate_architecture.outputs.result }}
          cache: "npm"

      - name: Install dependencies (old Node.js version)
        run: |
          rm package-lock.json
          npm install --ignore-engines --ignore-scripts
          npm install -D typescript@4
        if: matrix.node-version == '12.x' || matrix.node-version == '14.x' || matrix.node-version == '16.x' || matrix.node-version == '18.x'

      - name: Install dependencies
        run: npm ci
        if: matrix.node-version == '20.x' || matrix.node-version == '22.x' || matrix.node-version == '24.x'

      - name: Run tests for webpack version latest with experimentalUseImportModule
        run: npm run test:coverage -- --ci
        env:
          OLD_API: "true"

      - name: Submit coverage data to codecov
        uses: codecov/codecov-action@v5
        with:
          token: ${{ secrets.CODECOV_TOKEN }}

The same workflow, on Latchkey

Removes redundant runs and caps runaway jobs. Added and changed lines are highlighted.

workflow (.yml), optimized
name: mini-css-extract-plugin

on:
  push:
    branches:
      - main
      - next
  pull_request:
    branches:
      - main
      - next

permissions:
  contents: read

concurrency:
  group: ${{ github.workflow }}-${{ github.ref }}
  cancel-in-progress: true

jobs:
  lint:
    timeout-minutes: 30
    name: Lint - ${{ matrix.os }} - Node v${{ matrix.node-version }}

    env:
      GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}

    strategy:
      matrix:
        os: [ubuntu-latest]
        node-version: [lts/*]

    runs-on: ${{ matrix.os }}
    runs-on: latchkey-small

    concurrency:
      group: lint-${{ matrix.os }}-v${{ matrix.node-version }}-${{ github.ref }}
      cancel-in-progress: true

    steps:
      - uses: actions/checkout@v4
        with:
          fetch-depth: 0

      - name: Use Node.js ${{ matrix.node-version }}
        uses: actions/setup-node@v4
        with:
          node-version: ${{ matrix.node-version }}
          cache: "npm"

      - name: Install dependencies
        run: npm ci

      - name: Lint
        run: npm run lint

      - name: Build types
        run: npm run build:types

      - name: Check types
        run: if [ -n "$(git status types --porcelain)" ]; then echo "Missing types. Update types by running 'npm run build:types'"; exit 1; else echo "All types are valid"; fi

      - name: Security audit
        run: npm run security

      - name: Validate PR commits with commitlint
        if: github.event_name == 'pull_request'
        run: npx commitlint --from ${{ github.event.pull_request.head.sha }}~${{ github.event.pull_request.commits }} --to ${{ github.event.pull_request.head.sha }} --verbose

  test:
    timeout-minutes: 30
    name: Test - ${{ matrix.os }} - Node v${{ matrix.node-version }}, Webpack ${{ matrix.webpack-version }}

    strategy:
      matrix:
        os: [ubuntu-latest, windows-latest, macos-latest]
        node-version: [12.x, 14.x, 16.x, 18.x, 20.x, 22.x, 24.x]
        webpack-version: [latest]

    runs-on: ${{ matrix.os }}

    concurrency:
      group: test-${{ matrix.os }}-v${{ matrix.node-version }}-${{ matrix.webpack-version }}-${{ github.ref }}
      cancel-in-progress: true

    steps:
      - name: Setup Git
        if: matrix.os == 'windows-latest'
        run: git config --global core.autocrlf input

      - uses: actions/checkout@v4
      - uses: actions/github-script@v7
        id: calculate_architecture
        with:
          result-encoding: string
          script: |
            if ('${{ matrix.os }}' === 'macos-latest' && ('${{ matrix['node-version'] }}' === '12.x' || '${{ matrix['node-version'] }}' === '14.x')) {
              return "x64"
            } else {
              return ''
            }
      - name: Use Node.js ${{ matrix.node-version }}
        uses: actions/setup-node@v4
        with:
          node-version: ${{ matrix.node-version }}
          architecture: ${{ steps.calculate_architecture.outputs.result }}
          cache: "npm"

      - name: Install dependencies (old Node.js version)
        run: |
          rm package-lock.json
          npm install --ignore-engines --ignore-scripts
          npm install -D typescript@4
        if: matrix.node-version == '12.x' || matrix.node-version == '14.x' || matrix.node-version == '16.x' || matrix.node-version == '18.x'

      - name: Install dependencies
        run: npm ci
        if: matrix.node-version == '20.x' || matrix.node-version == '22.x' || matrix.node-version == '24.x'

      - name: Install webpack ${{ matrix.webpack-version }}
        if: matrix.webpack-version != 'latest'
        run: npm i webpack@${{ matrix.webpack-version }}

      - name: Run tests for webpack version ${{ matrix.webpack-version }}
        run: npm run test:coverage -- --ci

      - name: Submit coverage data to codecov
        uses: codecov/codecov-action@v5
        with:
          token: ${{ secrets.CODECOV_TOKEN }}

  test-old-api:
    timeout-minutes: 30
    name: Test - ${{ matrix.os }} - Node v${{ matrix.node-version }}, Webpack latest, old API

    strategy:
      matrix:
        os: [ubuntu-latest, windows-latest, macos-latest]
        node-version: [12.x, 14.x, 16.x, 18.x, 20.x, 22.x, 24.x]

    runs-on: ${{ matrix.os }}

    steps:
      - name: Setup Git
        if: matrix.os == 'windows-latest'
        run: git config --global core.autocrlf input

      - uses: actions/checkout@v4
      - uses: actions/github-script@v7
        id: calculate_architecture
        with:
          result-encoding: string
          script: |
            if ('${{ matrix.os }}' === 'macos-latest' && ('${{ matrix['node-version'] }}' === '12.x' || '${{ matrix['node-version'] }}' === '14.x')) {
              return "x64"
            } else {
              return ''
            }
      - name: Use Node.js ${{ matrix.node-version }}
        uses: actions/setup-node@v4
        with:
          node-version: ${{ matrix.node-version }}
          architecture: ${{ steps.calculate_architecture.outputs.result }}
          cache: "npm"

      - name: Install dependencies (old Node.js version)
        run: |
          rm package-lock.json
          npm install --ignore-engines --ignore-scripts
          npm install -D typescript@4
        if: matrix.node-version == '12.x' || matrix.node-version == '14.x' || matrix.node-version == '16.x' || matrix.node-version == '18.x'

      - name: Install dependencies
        run: npm ci
        if: matrix.node-version == '20.x' || matrix.node-version == '22.x' || matrix.node-version == '24.x'

      - name: Run tests for webpack version latest with experimentalUseImportModule
        run: npm run test:coverage -- --ci
        env:
          OLD_API: "true"

      - name: Submit coverage data to codecov
        uses: codecov/codecov-action@v5
        with:
          token: ${{ secrets.CODECOV_TOKEN }}

What changed

  1. Run on Latchkey managed runners with one line (runs-on), which apply the fixes below automatically and self-heal transient failures. Each Linux x64 job moves to the Latchkey size matching its vCPU count, latchkey-small for a standard 2 vCPU runner; macOS, Windows and arm64 jobs stay as written.
  2. Cancel superseded runs when a branch or PR gets a newer push.
  3. Add a job timeout so a hung step cannot burn hours of runner time.

Left runs-on as written on the test job: matrix.os mixes Linux with Windows and macOS, which Latchkey does not run. Point only the Linux legs at Latchkey, for example with a matrix include entry that sets the runner.

Left runs-on as written on the test-old-api job: matrix.os mixes Linux with Windows and macOS, which Latchkey does not run. Point only the Linux legs at Latchkey, for example with a matrix include entry that sets the runner.

1 third-party action is referenced by a movable tag. Pin it to the commit SHA (Latchkey resolves and applies this automatically) so a repointed tag cannot change what runs.

What Latchkey heals here

This workflow has steps that commonly fail on transient issues (network, registries, flaky browsers). On Latchkey managed runners they are detected, retried, and self-healed instead of failing your build:

  • Dependency installs

This workflow runs 3 jobs (43 with the matrix expanded) per trigger. 15 of the 43 run on a standard GitHub-hosted Linux x64 runner, which in a private repository bills $0.006 a minute against $0.0025 on latchkey-small, 58% lower; in a public repository like this one they are free. 28 of the 43 run on Windows and macOS, which Latchkey does not offer, so those stay where they are. Estimate the monthly difference with your own run counts.

Actions used in this workflow

  • actions/checkout
  • actions/setup-node
  • actions/github-script
  • codecov/codecov-action

Frequently asked questions

What does the mini-css-extract-plugin workflow (webpack/mini-css-extract-plugin) workflow do?
This is the mini-css-extract-plugin workflow from the webpack/mini-css-extract-plugin repository, a real project running GitHub Actions. It is shown here with attribution under its MIT license.
What CI health grade does this workflow get?
This Node.js workflow grades C. Paste your own workflow into the Latchkey grader to see its grade and the exact fixes.
How can I improve this Node.js workflow?
Add run de-duplication and job timeouts. Latchkey applies these automatically on managed runners when you point runs-on at Latchkey.

References