starter nuxt ionic tailwind firebase

NUXT 3離子尾風射擊底座最小起動器

查看NUXT 3文檔以了解更多信息。

• NUXT離子模塊-https：//ionic.nuxtjs.org/
• NUXT Supabase模塊-https：//supabase.nuxtjs.org/
• NUXT尾風模塊-https：//tailwindcss.nuxtjs.org/
• nuxt vuefire -https：//vuefire.vuejs.org/nuxt/getting-started.html
  • 驗證問題：Firebase/Firebase-JS-SDK＃5019
• 離子與代碼擴展-https：//ionicframework.com/docs/intro/vscode-extension

更改package.json用於使用離子擴展名並為移動設備構建應用程序的JSON

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

更改nuxt.config.ts用於使用離子擴展名並為移動設備構建應用程序，您必須設置ssr:false和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,
    },
  },
});

更改用於使用離子擴展名的capacitor.config.ts dist

 import { CapacitorConfig } from '@capacitor/cli'

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

export default config

解決燃料問題

由於電容器上的firebase問題，我編寫了自己的getauth綜合，在設備上運行時必須使用該組合

 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;
};