Build Cache · Nuxt OG Image · Nuxt SEO

-
-
-
-

[1.4K](https://github.com/harlan-zw/nuxt-seo)

[Nuxt SEO on GitHub](https://github.com/harlan-zw/nuxt-seo)

**OG Image v6** is here! Looking for an older version?

.

OG Image

-
-
-
-
-
-
-
-
-
-

Search…```k`` /`

v6 (latest)

- Playgrounds
- [Discord Support](https://discord.com/invite/275MBUBvgP)

### Getting Started

-
-
-
-

### Core Concepts

-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-

### Overview

-
-
-
-

### Integrations

-
-
-

Core Concepts

# Build Cache

[Copy for LLMs](https://nuxtseo.com/docs/og-image/guides/build-cache.md)

For CI/CD environments, you can enable persistent build caching to skip regenerating images when the output would be identical between deployments.

## [Setup](#setup)

nuxt.config.ts

```
export default defineNuxtConfig({
  ogImage: {
    buildCache: true
  }
})
```

This stores rendered images in `node_modules/.cache/nuxt-seo/og-image/` during prerendering.

When using [pnpm](https://pnpm.io), this will be in the `node_modules/.pnpm` directory's cache structure. Consider using a [custom cache directory](#custom-cache-directory) for consistency.

## [Invalidation](#invalidation)

The cache automatically invalidates when:

- **Options change**: different title, description, or other props
- **Template changes**: the component file is modified
- **Module version changes**: you upgrade `nuxt-og-image`

## [Automatic Cleanup](#automatic-cleanup)

After each prerender, orphaned cache files (images no longer generated) are automatically cleaned up if they're older than 7 days. This prevents unbounded cache growth while preserving images that social platforms may still be referencing.

## [CI Configuration](#ci-configuration)

To persist the cache between CI runs, add the cache directory to your CI configuration:

GitHub Actions

GitLab CI

```
- name: Cache OG Images
  uses: actions/cache@v4
  with:
    path: node_modules/.cache/nuxt-seo
    key: og-images-${{ github.ref_name }}
```

```
cache:
  paths:
    - node_modules/.cache/nuxt-seo/
```

## [Custom Cache Directory](#custom-cache-directory)

You can customize the cache location:

nuxt.config.ts

```
export default defineNuxtConfig({
  ogImage: {
    buildCache: {
      base: '.cache/og-image'
    }
  }
})
```

[Edit this page](https://github.com/nuxt-modules/og-image/edit/main/docs/content/3.guides/3.build-cache.md)

[Markdown For LLMs](https://nuxtseo.com/docs/og-image/guides/build-cache.md)

Did this page help you?

On this page

- [Setup](#setup)
- [Invalidation](#invalidation)
- [Automatic Cleanup](#automatic-cleanup)
- [CI Configuration](#ci-configuration)
- [Custom Cache Directory](#custom-cache-directory)

[GitHub](https://github.com/harlan-zw/nuxt-seo) [ Discord](https://discord.com/invite/275MBUBvgP)

###

-
-

Modules

-
-
-
-
-
-
-
-
-

###

-
-
-

###

Nuxt

-
-
-
-
-

Vue

-
-
-
-
-
-
-
-

###

-
-
-
-
-
-
-
-
-
-

Copyright © 2023-2026 Harlan Wilton - [MIT License](https://github.com/harlan-zw/nuxt-seo/blob/main/license) · [mdream](https://mdream.dev)