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.
C
CI health: C - fair
Run this on Latchkey for self-healing, caching, and up to 58% lower cost.
Grade your own workflow free or run it on Latchkey →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.
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 }} 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
- Cancel superseded runs when a branch or PR gets a newer push.
- Add a job timeout so a hung step cannot burn hours of runner time.
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. On Latchkey the same minutes cost up to 58% less than GitHub-hosted, with zero queue time.