vue.js - Why are Amplify environment variables not loading in my VueNuxt component? - Stack Overflow

admin管理员组

文章数量:1305592

I have set environment variables in AWS Amplify, with the VUE_APP_ prefix, but they aren't loading on production. Locally, they're pulled in fine from a .env file.

Here's an example of a variable in Amplify:

And here's where I'm using it in app.vue:

seoMeta(
  `${import.meta.dev ? '(Local) ' : ''} ${process.env.VUE_APP_META_TITLE}`,
  process.env.VUE_APP_META_DESCRIPTION,
  process.env.VUE_APP_META_IMAGE
);

However, I have found that the variables are imported fine inside nuxt.config.js:

$production: {
    scripts: {
      registry: {
        googleAnalytics: true
      }
    },
    runtimeConfig: {
      public: {
        scripts: {
          googleAnalytics: {
            id: process.env.VUE_APP_GOOGLE_TAG_ID
          },
        },
      },
    }
  },

So it's just loading inside the component that's causing an issue.

Is there something else I need to do to wire it all up?

本文标签： vuejsWhy are Amplify environment variables not loading in my VueNuxt componentStack Overflow