---
title: "Features"
description: "Enable or disable optional Nuxt features to unlock new possibilities."
canonical_url: "https://nuxt.com/docs/4.x/guide/going-further/features"
---
# Features

> Enable or disable optional Nuxt features to unlock new possibilities.

Some features of Nuxt are available on an opt-in basis, or can be disabled based on your needs.

## `features`

### devLogs

Stream server logs to the client as you are developing. These logs can be handled in the `dev:ssr-logs` hook.

By default, this is enabled in development (when test mode is not active).

If set to `silent`, the logs will not be printed to the browser console.

```ts [nuxt.config.ts]
export default defineNuxtConfig({
  features: {
    devLogs: true,
  },
})
```

### inlineStyles

Inlines styles when rendering HTML. This is currently available only when using Vite.

You can also pass a function that receives the path of a Vue component and returns a boolean indicating whether to inline the styles for that component.

It defaults to `(id) => id.includes('.vue')`.

```ts [nuxt.config.ts]
export default defineNuxtConfig({
  features: {
    inlineStyles: false, // or a function to determine inlining
  },
})
```

### noScripts

Turn off rendering of Nuxt scripts and JavaScript resource hints, so pages ship as pure HTML and CSS.

Possible values:

- `false` (default): scripts are rendered normally.
- `'production'` (or `true`, which is normalized to `'production'`): scripts are omitted in production builds only, so hot module replacement and other development features keep working in `nuxt dev`.
- `'all'`: scripts are omitted in both development and production.

Pages served without scripts navigate with full-page loads. To keep navigation fast, Nuxt emits a [speculation rules](https://developer.mozilla.org/en-US/docs/Web/API/Speculation_Rules_API) tag on these pages so supporting browsers prefetch and prerender the targets before the user follows a link. The tag is declarative JSON and executes no JavaScript. The rules are scoped to your page routes (which are safe to `GET`) rather than every same-origin link, so a link to a server route such as `/logout` is never speculatively fetched. A catch-all page (for example `pages/[...slug].vue`) matches every path, which widens this back to all same-origin links.

Client-side navigation *to* a route covered by a `noScripts` route rule triggers a full document load instead, so the route is actually served without scripts rather than being rendered by the client-side router. Pages whose routes are known at build time to be covered by such a rule are also excluded from the client bundle entirely.

Scripted pages emit their own speculation rules tag scoped to the `noScripts` route patterns, so browsers can prefetch and prerender those targets before a full-page navigation to them. When view transitions are enabled, these pages also opt into declarative cross-document view transitions to animate the navigation.

```ts [nuxt.config.ts]
export default defineNuxtConfig({
  features: {
    noScripts: 'production', // or 'all' | false
  },
})
```

You can also disable scripts per-route with the `noScripts` [route rule](https://nuxt.com/docs/4.x/guide/concepts/rendering#hybrid-rendering), which applies in all modes:

```ts [nuxt.config.ts]
export default defineNuxtConfig({
  routeRules: {
    '/blog/**': { noScripts: true },
  },
})
```

When `noScripts` applies to a rendered page, the following are omitted from the HTML:

- the Nuxt entry `<script>` tags
- the import map for the entry chunk
- the inlined payload `<script>` (and the payload preload link, when payload extraction is enabled)
- JavaScript resource hints (`preload` and `prefetch` links for JS chunks)

CSS is unaffected: stylesheet links and inlined styles are still rendered, so the page looks identical. The page simply never hydrates, which means nothing on it is interactive.

A few interactions to be aware of:

- Routes with the `noScripts` route rule are always rendered with the buffered (non-streaming) renderer.
- [Server components](https://nuxt.com/docs/4.x/guide/concepts/server-components) that only render static HTML work fine, but components hydrated with `nuxt-client` and interactive island slots rely on an inline script to relocate teleported content, so they will not become interactive on a `noScripts` route. When `features.noScripts` is set app-wide and component islands are active, Nuxt also falls back to buffered rendering for this reason.

<read-more to="https://nuxt.com/docs/4.x/guide/recipes/mostly-static-sites">

See the mostly-static site recipe for combining `noScripts` with prerendering, islands and lazy hydration.

</read-more>

## `future`

There is also a `future` namespace for early opting-in to new features that will become default in a future (possibly major) version of the framework.

### compatibilityVersion

This enables early access to Nuxt features or flags.

Setting `compatibilityVersion` to `5` changes defaults throughout your Nuxt configuration to opt in to Nuxt v5 behaviour, including enabling the [Vite Environment API](https://nuxt.com/docs/4.x/guide/going-further/experimental-features#viteenvironmentapi).

```ts
export default defineNuxtConfig({
  future: {
    compatibilityVersion: 5,
  },
})
```

<read-more to="https://nuxt.com/docs/4.x/getting-started/upgrade#testing-nuxt-5">

Learn more about testing Nuxt 5.

</read-more>

### multiApp

This enables early access to the experimental multi-app support. You can follow the [tracker issue #21635](https://github.com/nuxt/nuxt/issues/21635) to see the progress of multi-app support in Nuxt.

```ts [nuxt.config.ts]
export default defineNuxtConfig({
  future: {
    multiApp: true,
  },
})
```

### typescriptBundlerResolution

This enables 'Bundler' module resolution mode for TypeScript, which is the recommended setting for frameworks like Nuxt and [Vite](https://vite.dev/guide/performance#reduce-resolve-operations).

It improves type support when using modern libraries with `exports`.

See [the original TypeScript pull request](https://github.com/microsoft/TypeScript/pull/51669).

You can set it to false to use the legacy 'Node' mode, which is the default for TypeScript.

```ts [nuxt.config.ts]
export default defineNuxtConfig({
  future: {
    typescriptBundlerResolution: false,
  },
})
```


## Sitemap

See the full [sitemap](https://nuxt.com/sitemap.md) for all pages.
