Vite Quick Start (React, Vue, Svelte, SolidJS, etc.)

Step 1: Install the Codecov Vite Plugin

To install the @codecov/vite-plugin to your project, use the following commands.

npm install @codecov/vite-plugin --save-dev

yarn add @codecov/vite-plugin --dev

pnpm add @codecov/vite-plugin --save-dev

Step 2: Configure the bundler plugin

Import the bundler plugin, and add it to the end of your plugin array found inside your vite.config.js file.

You can find a Codecov upload token on the settings page for your repository or organization in the Codecov UI. For more information, see the documentation.

// vite.config.js
import { defineConfig } from "vite";
import { codecovVitePlugin } from "@codecov/vite-plugin";

export default defineConfig({
  plugins: [
    // Put the Codecov Vite plugin after all other plugins
    codecovVitePlugin({
      enableBundleAnalysis: process.env.CODECOV_TOKEN !== undefined,
      bundleName: "<bundle project name>",
      uploadToken: process.env.CODECOV_TOKEN,
    }),
  ],
});

Step 3: Commit and push your latest changes

The plugin requires at least one commit to be made to properly upload bundle analysis information up to Codecov.

git add -A && git commit -m "Add Codecov bundler plugin" && git push

Step 4: Build the Application

When building your application the plugin will automatically upload the stats information to Codecov.

npm run build

yarn run build

pnpm run build