\n```\n\nSeperti yang disebutkan sebelumnya, ketika menginstal plugin baru, kita perlu melakukan operasi sinkronisasi dan kemudian mendeploy ulang aplikasi ke perangkat kita.Untuk melakukan ini, jalankan perintah berikut:\n\n```\nnpx cap sync\n```\n\nSetelah menekan tombol, Anda dapat menyaksikan dialog berbagi native yang indah dalam aksi!\n\n## Menambahkan Konsta UI\n\nUntuk menggunakan Konsta UI dalam aplikasi Nuxt 3 Anda, Anda perlu [sudah menginstal tailwind](https://tailwindcss.com/docs/guides/nuxtjs/) dan menginstal paket:\n\n```shell\nnpm i konsta\n```\n\nSelain itu, Anda perlu memodifikasi file `tailwind.config.js` Anda:\n\n```javascript\n// import konstaConfig config\nconst konstaConfig = require('konsta/config')\n\n// wrap config with konstaConfig config\nmodule.exports = konstaConfig({\n content: [\n './pages/**/*.{vue}',\n './components/**/*.{vue}',\n ],\n darkMode: 'media', // or 'class'\n theme: {\n extend: {},\n },\n variants: {\n extend: {},\n },\n plugins: [],\n})\n```\n\n`konstaConfig` akan memperluas konfigurasi Tailwind CSS default (atau kustom Anda) dengan beberapa varian tambahan dan utilitas pembantu yang diperlukan untuk Konsta UI\n\nSekarang kita perlu menyiapkan komponen [App](https://konsta.ui.com/vue/app/) utama sehingga kita dapat mengatur beberapa parameter global (seperti `theme`)\n\nKita perlu membungkus seluruh aplikasi dengan `App` di `pages/_app.vue`:\n\n```html\n\n\n\n```\n\n### Contoh Halaman\n\nSekarang setelah semuanya diatur, kita dapat menggunakan komponen Vue Konsta UI di halaman Nuxt 3 kita\n\nSebagai contoh, mari buka `pages/index.vue` dan ubah menjadi berikut:\n\n```html\n\n\n\n```\n\nJika live reload tidak sinkron setelah menginstal semua komponen yang diperlukan, coba restart semuanya. Setelah Anda melakukan itu, Anda seharusnya melihat aplikasi mobile dengan tampilan yang agak native, dibangun dengan Nuxt 3 dan Capacitor!\n\nAnda seharusnya melihat halaman berikut sebagai hasilnya:\n\n