Nuxt 3 Firebase starter with PrimeVue

🧪 Working in Progress

🖥 Online Preview

Features

• 💚 Nuxt 3 - SSR, ESR, File-based routing, components auto importing, modules, etc.

• 🔥 The <script setup> syntax

• 🚠 Firebase v9 for Firestore database services

• 🚀 The PrimeVue for styled components

• 🗽 The Boostrap 5 for style

• 🍍 State Management via Pinia

• 🍍 + 💽 pinia-plugin-persistedstate-2 plugin for saving stores locally

• 🚦 VeeValidate for input forms with i18n support

• 🌎 intlify/i18n support, now supports 🇬🇧, 🇫🇷, 🇵🇹, 🇯🇵

• 📥 APIs auto importing - for Composition API, VueUse and custom composables.

• 🏎 Firebase cloud functions and deploy

• 🦾 Mainly TypeScript

Plugins

Nuxt Modules

• Firebase v9 - New version of Firebase services
• TailwindCSS - It's fast, flexible, and reliable — with zero-runtime.
• Pinia - intuitive, type safe, light and flexible Store for Vue.

IDE

We recommend using VS Code with Volar to get the best experience (You might want to disable Vetur if you have it).

Nuxt3 Firebase Starter with PrimeVue development

Setup

Make sure to install the dependencies

npm install

Current workaround for error 'ReferenceError: IDBIndex is not defined'

npm i firebase@9.6.7 —save-exact

Or you may face the following error

ERROR  nuxi requires @nuxt/kit to be installed in your project. Try installing nuxt3 or @nuxt/bridge first.  

Then do the following and yarn install do the rest of it.

npx nuxi upgrade --force

Then

npm run dev

Preview

Delete .output folder and run below commands

npm run build
npx nuxi preview

Production

Build the application for production:

NITRO_PRESET=firebase yarn build

Using emulators, you can preview the result on locally

firebase emulators:start 

Deploy

firebase deploy

Checkout the deployment documentation.