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 grade
- 56/100
- Health score
- 3
- Jobs per trigger
- 3
- Fixes in the optimized version
In short
- CI health: C (fair)
- 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
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 }}
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
- 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-smallfor a standard 2 vCPU runner; macOS, Windows and arm64 jobs stay as written. - 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.
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