From 975331a7b1b544062862b50e05dbbfaec41a2a51 Mon Sep 17 00:00:00 2001
From: Romain Hamel <rom.hml@gmail.com>
Date: Wed, 23 Apr 2025 17:36:06 +0200
Subject: [PATCH] docs(installation): update instructions for inertia (#3964)

Co-authored-by: Benjamin Canac <canacb1@gmail.com>
---
 .../1.getting-started/2.installation/2.vue.md | 27 +++++++++++++++++++
 1 file changed, 27 insertions(+)

diff --git a/docs/content/1.getting-started/2.installation/2.vue.md b/docs/content/1.getting-started/2.installation/2.vue.md
index ea02acab..e38e7c1a 100644
--- a/docs/content/1.getting-started/2.installation/2.vue.md
+++ b/docs/content/1.getting-started/2.installation/2.vue.md
@@ -99,6 +99,10 @@ app.use(ui)
 app.mount('#app')
 ```
 
+::note{to="#inertia"}
+If you're using [Inertia.js](https://inertiajs.com/), you can skip the `vue-router` setup as Inertia provides its own routing system.
+::
+
 #### Import Tailwind CSS and Nuxt UI in your CSS
 
 ```css [assets/main.css]
@@ -313,6 +317,29 @@ export default defineConfig({
 This option adds the `transition-colors` class on components with hover or active states.
 ::
 
+### `inertia`
+
+Use the `inertia` option to enable compatibility with [Inertia.js](https://inertiajs.com/).
+
+```ts [vite.config.ts]
+import { defineConfig } from 'vite'
+import vue from '@vitejs/plugin-vue'
+import ui from '@nuxt/ui/vite'
+
+export default defineConfig({
+  plugins: [
+    vue(),
+    ui({
+      inertia: true
+    })
+  ]
+})
+```
+
+::note
+When using this option, `vue-router` is not required as Inertia.js provides its own routing system. The components that would normally use `RouterLink` will automatically use Inertia's `InertiaLink` component instead.
+::
+
 ## Continuous Releases
 
 Nuxt UI uses [pkg.pr.new](https://github.com/stackblitz-labs/pkg.pr.new) for continuous preview releases, providing developers with instant access to the latest features and bug fixes without waiting for official releases.