Skip to content

Add Vercel Web Analytics to Next.js#1876

Open
vercel[bot] wants to merge 1 commit intomainfrom
vercel/vercel-web-analytics-to-nextjs-p9aayi
Open

Add Vercel Web Analytics to Next.js#1876
vercel[bot] wants to merge 1 commit intomainfrom
vercel/vercel-web-analytics-to-nextjs-p9aayi

Conversation

@vercel
Copy link

@vercel vercel bot commented Feb 24, 2026

Vercel Web Analytics Integration

Successfully installed and configured Vercel Web Analytics for this Next.js project.

Changes Made

1. Package Installation

  • Added @vercel/analytics@^1.6.1 to dependencies
  • Updated yarn.lock with the new package

2. Code Changes

  • Modified: pages/_app.js
    • Imported Analytics component from @vercel/analytics/react (aliased as VercelAnalytics to avoid name collision with existing Plausible Analytics component)
    • Added <VercelAnalytics /> component after the existing <Analytics /> component
    • Placed it inside the <ThemeProvider> component as per best practices

Implementation Details

This is a Pages Router Next.js project (uses /pages directory structure), so the Analytics component was added to pages/_app.js as specified in the Vercel Analytics documentation.

The implementation preserves the existing Plausible Analytics setup (imported from ../components/analytics.js) and adds Vercel Analytics alongside it, allowing both analytics solutions to run simultaneously.

Verification

  • ✅ Linting passed with no new errors
  • ✅ Code syntax is valid
  • ✅ Lock file updated correctly
  • ✅ Existing code structure preserved

Notes

The project already had a custom Analytics component for Plausible, so I aliased the Vercel Analytics import as VercelAnalytics to prevent naming conflicts. Both analytics solutions are now active in the application.


View Project · Web Analytics

Created by Echo (3kh0) with Vercel Agent

## Vercel Web Analytics Integration

Successfully installed and configured Vercel Web Analytics for this Next.js project.

### Changes Made

**1. Package Installation**
- Added `@vercel/analytics@^1.6.1` to dependencies
- Updated `yarn.lock` with the new package

**2. Code Changes**
- **Modified: `pages/_app.js`**
  - Imported `Analytics` component from `@vercel/analytics/react` (aliased as `VercelAnalytics` to avoid name collision with existing Plausible Analytics component)
  - Added `<VercelAnalytics />` component after the existing `<Analytics />` component
  - Placed it inside the `<ThemeProvider>` component as per best practices

### Implementation Details

This is a **Pages Router** Next.js project (uses `/pages` directory structure), so the Analytics component was added to `pages/_app.js` as specified in the Vercel Analytics documentation.

The implementation preserves the existing Plausible Analytics setup (imported from `../components/analytics.js`) and adds Vercel Analytics alongside it, allowing both analytics solutions to run simultaneously.

### Verification

- ✅ Linting passed with no new errors
- ✅ Code syntax is valid
- ✅ Lock file updated correctly
- ✅ Existing code structure preserved

### Notes

The project already had a custom Analytics component for Plausible, so I aliased the Vercel Analytics import as `VercelAnalytics` to prevent naming conflicts. Both analytics solutions are now active in the application.

Co-authored-by: Vercel <vercel[bot]@users.noreply.github.com>
@vercel
Copy link
Author

vercel bot commented Feb 24, 2026

The latest updates on your projects. Learn more about Vercel for GitHub.

Project Deployment Actions Updated (UTC)
site Ready Ready Preview, Comment Feb 24, 2026 11:35pm

Request Review

@3kh0 3kh0 marked this pull request as ready for review February 24, 2026 23:37
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

0 participants