Build a Vite site on every push.

01 / BEFORE YOU START

Check the project locally.

Your repository needs a package.json with a build script and a committed package-lock.json. Run the same commands the workflow will run:

npm ci
npm run build

For a standard Vite project, the build output appears in dist/. If the local build fails, fix it before adding CI.

02 / THE WORKFLOW

Add .github/workflows/ci.yml.

Create the folders if needed, then add this file at the repository root. The example checks the main branch; change that name if your default branch differs.

name: Build Vite site

on:
  push:
    branches: [main]
  pull_request:
    branches: [main]

permissions:
  contents: read

jobs:
  build:
    runs-on: ubuntu-latest
    steps:
      - name: Check out repository
        uses: actions/checkout@v4
      - name: Set up Node.js
        uses: actions/setup-node@v4
        with:
          node-version: '22'
          cache: npm
      - name: Install dependencies
        run: npm ci
      - name: Build site
        run: npm run build

What each step does: checkout gets your code; setup-node installs Node and enables npm dependency caching; npm ci installs the locked versions; the build step checks that Vite can produce the site.

This workflow checks a build. It does not deploy to GitHub Pages. Keep your existing deployment workflow separate.

03 / VERIFY

Push, then read the run.

1. Commit .github/workflows/ci.yml and push to GitHub.
2. Open your repository’s Actions tab.
3. Select the Build Vite site workflow and open the latest run.
4. Check that all four steps complete. On a failure, expand the first failed step and read its log.

A green run means this particular build passed. It does not prove that a deployed page or browser interaction works.

04 / COMMON FIXES

When the build fails.