# Nuxt.js Website Translation and Localization | Vitra.ai

> Localize Nuxt.js pages and interface content while preserving routes, server rendering, components, and application structure.

**Canonical URL**: https://www.vitra.ai/integration/nuxt-js
**Source**: This is the Markdown rendering of https://www.vitra.ai/integration/nuxt-js, generated at build time from that page.

---

[←All integrations](https://www.vitra.ai/integrations)

Nuxt.js Translation

Browse ▾

[←All integrations](https://www.vitra.ai/integrations)

![](https://www.vitra.ai/icons/integrations/nuxt.svg)

# Nuxt JS

Nuxt.js is a framework built on Vue.js for creating fast web applications. It offers features like routing and server-side rendering out of the box.

[Connect](https://universe.vitra.ai)

## Using Universe Website Translation in a Nuxt.js Project (Pre-Installed Setup)

If Nuxt.js is already available in your environment, you don't need to install anything. You only need to add the Universe Website Translation snippet globally so it loads on every page and route.

![Using Universe Website Translation in a Nuxt.js Project (Pre-Installed Setup)](https://www.vitra.ai/static/images/integration/shared/js-overview.png)

## Step-by-Step Configuration for Nuxt.js

### Step 1

When creating a new project:

- Choose Nuxt.js
- Finish the setup wizard
- Generate/deploy the project

Now you just need to add the Vitra / Universe Website Translation snippet to Nuxt's global head.

### Step 2

This prevents Nuxt from sanitizing inline script content.

![Step 2](https://www.vitra.ai/static/images/integration/nuxt-js/step-2.png)

### Step 3

After saving config:

- npm run dev

For production:

- npm run build
- npm run start

Universe Website Translation is now active across all Nuxt routes.

## Important for Nuxt (SPA + SSR)

Nuxt uses:

- SSR (server rendering)
- client navigation
- hydration

So the snippet must be:

- global config level (nuxt.config)
- not only inside one page/component

That ensures it works across every route.

## Easy to Remove

To disable:

- Remove the script block from nuxt.config
- Rebuild / redeploy

No side effects.

## Where to go next

Nuxt.js Website Translation and Localization is one way into Vitra.ai. Website translation is the capability doing the work behind it.

[CapabilityWebsite translation](https://www.vitra.ai/features/website-translation)[Read nextTranslate a Nuxt App With i18n Routing](https://www.vitra.ai/general/translate-a-nuxt-app)[Read nextContinuous localization for always-on content](https://www.vitra.ai/general/continuous-localization)

Browse every connector on the [integrations directory](https://www.vitra.ai/integrations).

---

## Structured data

```json
{
  "@context": "https://schema.org",
  "@type": "SoftwareApplication",
  "name": "Nuxt.js Website Translation and Localization integration",
  "applicationCategory": "BusinessApplication",
  "operatingSystem": "Web",
  "url": "https://www.vitra.ai/integration/nuxt-js",
  "description": "Localize Nuxt.js pages and interface content while preserving routes, server rendering, components, and application structure.",
  "featureList": [
    "Remove the script block from nuxt.config",
    "Rebuild / redeploy"
  ],
  "isPartOf": {
    "@type": "SoftwareApplication",
    "name": "Vitra Universe",
    "url": "https://www.vitra.ai"
  },
  "publisher": {
    "@id": "https://www.vitra.ai/#organization"
  }
}
```

```json
{
  "@context": "https://schema.org",
  "@type": "BreadcrumbList",
  "itemListElement": [
    {
      "@type": "ListItem",
      "position": 1,
      "name": "Home",
      "item": "https://www.vitra.ai"
    },
    {
      "@type": "ListItem",
      "position": 2,
      "name": "Integrations",
      "item": "https://www.vitra.ai/integrations"
    },
    {
      "@type": "ListItem",
      "position": 3,
      "name": "Nuxt.js Website Translation and Localization integration",
      "item": "https://www.vitra.ai/integration/nuxt-js"
    }
  ]
}
```