starter nuxt ionic tailwind firebase

Nuxt 3 Ionic Tailwind Firebase Démarreur minimal

Regardez la documentation Nuxt 3 pour en savoir plus.

• Nuxt ionic module - https://ionic.nuxtjsjs.org/
• Module Nuxt Supabase - https://supabase.nuxtjs.org/
• Module Nuxt Tailwind - https://tailwindcss.nuxtjs.org/
• Nuxt vuefire - https://vuefire.vuejs.org/nuxt/getting-started.html
  • Problème de l'automne: Firebase / Firebase-JS-SDK # 5019
• Extension ionic vs code - https://ionicframework.com/docs/intro/vscode-extension

modifie package.json pour utiliser des applications ioniques d'extension et de création pour les appareils mobiles

  "scripts": {
    "dev": "nuxi dev",
    "build": "nuxi generate",
    "ionic:build": "npm run build",
    "ionic:serve": "npm run dev"
  },

modifie nuxt.config.ts pour utiliser des applications d'extension et de création ioniques pour les appareils mobiles, vous devez définir ssr:false et auth:false for Vurefire

 export default defineNuxtConfig({
  modules: ["@nuxtjs/ionic", "@nuxtjs/tailwindcss", "nuxt-vuefire"],
  ssr: false,
  vuefire: {
    auth: false,
    config: {
      apiKey: process.env.FIREBASE_API_KEY,
      projectId: process.env.FIREBASE_PROJECT_ID,
      appId: process.env.FIREBASE_APP_ID,
    },
  },
  ionic: {
    css: {
      utilities: true,
    },
  },
});

modifie capacitor.config.ts pour utiliser des applications ioniques d'extension et de création pour les appareils mobiles, vous devez définir webdir sur dist

 import { CapacitorConfig } from '@capacitor/cli'

const config: CapacitorConfig = {
  appId: 'io.ionic.starter',
  appName: 'nuxt-ionic-playground',
  webDir: 'dist',
  bundledWebRuntime: false,
}

export default config

Résolution du problème de la base de feu

En raison du problème de la base de feu sur le condensateur, j'ai écrit mon propre composable GetAuth qui doit être utilisé lors de l'exécution sur l'appareil

 import {
  indexedDBLocalPersistence,
  initializeAuth,
} from "firebase/auth";
import { getApp } from "firebase/app";
export const useFbAuth = () => {
  let auth;
  console.log("use persistence");
  auth = initializeAuth(getApp(), {
    persistence: indexedDBLocalPersistence,
  });
  return auth;
};