Environment variable static app

Question

yannick 21

We have a vueJs app deployed as static web app in azure.
I am not able to get an Env variable like that : this.pk = process.env.STRIPE_PK;

I tried to put env variable in github action deployment, in azure env variables too..

Someone can help on that?

Thank you.

1 answer

Answer 1

yannick 21

I tried to call my variable VUE_APP_STRIPE_PK but same issue
IntegrationError: Missing value for Stripe(): apiKey should be a string.

Anthony Chu - MSFT 861 Reputation points Microsoft Employee

2021-12-22T19:15:35.557+00:00

Would need more info to troubleshoot. Is the app in a public repo?
yannick 21 Reputation points

2021-12-23T06:34:09.907+00:00

no its not sorry

but I have a plugin (nuxjts) called stripe.js and in this one I call

Vue.use(StripePlugin, { pk: process.env.VUE_APP_STRIPE_PK}); -> this does not work as we dont find this ENV VAR

Moreover I have a nuxt.config.js file and in this one I call this for example

apiKey: process.env.FIREBASE_API_KEY,

And this is working.
Anthony Chu - MSFT 861 Reputation points Microsoft Employee

2021-12-23T19:52:31.54+00:00

It's been a while since I've used Nuxt. When you say apiKey: process.env.FIREBASE_API_KEY is working, does it mean you can access it in your app using process.env.apiKey?

For Nuxt, I think you either add another item to the env config in nuxt.config.js like: stripePk: process.env.STRIPE_PK and access it in code with process.env.stripePk; or you name your variable with a NUXT_ENV_ prefix instead of VUE_APP_. Both of these methods are outlined here: https://nuxtjs.org/docs/configuration-glossary/configuration-env/