Как использовать переменные среды Firebase в Nuxt Config

Я пытаюсь отделить баллы Firebase от моего файла конфигурации Nuxt. Но он говорит NuxtServerError Your API key is invalid, please check you have copied it correctly. Он отлично работает, когда я использую свои кредиты непосредственно в моей конфигурации nuxt (без переменных среды).

Я использую модуль @ nuxtjs / firebase, и это моя конфигурация: firebase ssr / документация по универсальной аутентификации

  modules: [
    // Doc: https://axios.nuxtjs.org/usage
    '@nuxtjs/axios',
    // Doc: https://github.com/nuxt-community/dotenv-module
    '@nuxtjs/dotenv',
    '@nuxtjs/firebase',
    '@nuxtjs/pwa',
  ],

  firebase: {
    config: {
      apiKey: process.env.apiKey,
      authDomain: process.env.authDomain,
      databaseURL: process.env.databaseURL,
      projectId: process.env.projectId,
      storageBucket: process.env.storageBucket,
      messagingSenderId: process.env.messagingSenderId,
      appId: process.env.appId,
      measurementId: process.env.measurementId
    },
    services: {
      auth: {
        ssr: true
      }
    }
  },
  pwa: {
    // disable the modules you don't need
    meta: false,
    icon: false,
    // if you omit a module key form configuration sensible defaults will be applied
    // manifest: false,

    workbox: {
      importScripts: [
        // ...
        '/firebase-auth-sw.js'
      ],
      // by default the workbox module will not install the service worker in dev environment to avoid conflicts with HMR
      // only set this true for testing and remember to always clear your browser cache in development
      dev: false
    }
  }

Я сохранил все свои кредиты в .env файле в моем приложении (с кавычками).

apiKey="my_key"
authDomain="my_domain"
databaseURL="my_db_url"
projectId="my_project_id"
storageBucket="my_storage_bucket"
messagingSenderId="my_sender_id"
appId="my_app_id"
measurementId="my_measurement_id"

Есть ли способ отделить мои кредиты от файла конфигурации nuxt (я фиксирую свой файл конфигурации nuxt на моем github).

PS: мои переменные среды могут быть зарегистрированы в консоли из моего компонента приложения с помощью process.env.apikey и других. У меня также установлен пакет @ nuxtjs / dotenv.


person RiadSaidur    schedule 11.04.2020    source источник
comment
проверьте ответ stackoverflow.com/a/60483377/4523764   -  person Hardik Shah    schedule 14.04.2020


Ответы (3)


Это @nuxtjs/dotenv проблема (я думаю).

Что касается Использование файла .env в nuxt.config.js, в этом случае следует использовать непосредственно dotenv модуль вместо @nuxtjs/dotenv.

nuxt.config.ts образец

import dotenv from 'dotenv'

let path =
  process.env.NODE_ENV === 'production'
   ? '.env'
   : '.env.' + process.env.NODE_ENV

dotenv.config({path})

export default {
 ....
 // Now, you are able to use process.env.<property_from_dotenv>
 env: {
  apiKey: process.env.apiKey,
  authDomain: process.env.authDomain,
  databaseURL: process.env.databaseURL,
  projectId: process.env.projectId,
  storageBucket: process.env.storageBucket,
  messagingSenderId: process.env.messagingSenderId,
  appId: process.env.appId,
  measurementId: process.env.measurementId
 },
}

nuxt.config.js образец

const dotenv = require('dotenv');

let path =
  process.env.NODE_ENV === 'production'
   ? '.env'
   : '.env.' + process.env.NODE_ENV

dotenv.config({path})
person avan    schedule 12.04.2020

Nuxt имеет собственную запеченную обработку переменных окружения. О publicRuntimeConfig: {} и privateRuntimeConfig {} читайте в документации. Вам больше не нужна dotenv зависимость.

person Nawi    schedule 05.03.2021

Я тоже боролся с этой проблемой. Я использую ту же настройку.

Добавлять :

require('dotenv').config()

В начало файла nuxt.config.js. Это позволяет конфигурации получить доступ к вашему локальному файлу .env.

person CoderVtwo    schedule 14.04.2020