---
title: "Introduction"
description: "Eliminate version skew issues in your Nuxt application with intelligent update notifications and long-lived build assets."
canonical_url: "https://nuxtseo.com/docs/skew-protection/getting-started/introduction"
last_updated: "2026-05-20T04:43:19.739Z"
---

## Why Nuxt Skew Protection?

<skew-protection-demo-auto>



</skew-protection-demo-auto>

**Version skew** is a mismatch between your deployed build and the chunks running in user browsers and crawler sessions. It can lead to several issues:

- 🕷️ **Crawlers 404 on stale chunks** - Googlebot requests `_nuxt/builds/abc123.js` which no longer exists post-deploy, logging 500s and potentially impacting indexing
- 💥 **ChunkLoadError in production** - Users mid-session get `Failed to fetch dynamically imported module` when navigating to routes with invalidated chunks
- 🔄 **Delayed rollout** - Your latest release sits unloaded until users hard refresh, sometimes hours or days later

Nuxt's built-in behavior (hard-reload when it detects a new deployment) helps, but in many cases it's [not enough](https://github.com/nuxt/nuxt/issues/29624).

Nuxt Skew Protection does this with proactive update prompts and persistent build assets across deploys.

Ready to get started? Check out the
[installation guide](/docs/skew-protection/getting-started/installation).

### Nuxt Chunk Loading Errors

If you've come across any of the following errors in Google Search Console, [Sentry](https://sentry.io), or the browser console, they may be related to chunk loading failures,
which the module prevents:

> "Cannot read properties of undefined (reading 'default')"

> "Couldn't resolve component 'default' at /"

> "undefined is not an object (evaluating 'r.default')"

> "Failed to fetch dynamically imported module"

> "Importing a module script failed"

## Features

### 🕷️ Persistent Build Assets

Previous build artifacts remain accessible across deploys, avoiding broken requests from:

- Search engine crawlers hitting stale chunk URLs
- Users on old sessions navigating your app
- Progressive web apps with cached routes

The module stores assets with smart deduplication to minimize storage overhead.

### ⚡ Instant Update Prompts

Zero-config real-time notifications when you deploy a new version. Multiple transport strategies available:

- **Polling** - Works everywhere, uses Nuxt's built-in `app:manifest:update` hook
- **SSE** - Server-Sent Events for Node.js/Bun/Deno runtimes
- **WebSocket** - Real-time updates via Cloudflare Durable Objects
- **Adapters** - Third-party providers for any platform (see below)

### 🎯 Chunk-Aware Targeting

Not every deploy needs to interrupt users. Notifications fire only when the user's **currently loaded chunks** are invalidated by the new build.

A service worker tracks loaded JavaScript modules and detects when they're deleted in subsequent deployments - no false positives for unrelated updates.

### 🎨 Headless UI

Drop-in `<SkewNotification>` component with first-class Nuxt UI support:

```vue
<template>
  <SkewNotification v-slot="{ isCurrentChunksOutdated }">
    <div v-if="isCurrentChunksOutdated">
      New version available
    </div>
  </SkewNotification>
</template>
```

### 📊 Live Connection Monitoring

Track active connections and version distribution across your users in real-time:

- Monitor total connected users
- See which build versions are running
- Track rollout progress as users adopt new deployments

Perfect for admin dashboards and deployment monitoring. See [View Active Connections](/docs/skew-protection/guides/live-connections) for setup.

### 🔌 Third-Party Adapters

Get real-time update notifications on **any platform** including static sites using external [WebSocket](https://developer.mozilla.org/en-US/docs/Web/API/WebSocket) providers:

- [Pusher](https://pusher.com) - Hosted WebSocket service with generous free tier
- [Ably](https://ably.com) - Realtime messaging platform

See [External Providers](/docs/skew-protection/providers/external) for setup guides.