I am new to Nuxt (using Nuxt 2.15.3 + Vue2 + Javascript).
I am having some difficulties with an AUTH_PROVIDER_URL environment variable which is set to be different on my local setup, on my staging servers and in the production environment. I am 100% sure that the environment variable is set correctly in each environment.
The issue I have is in the nuxt.config.js file and under the “auth” section where I need to point to a different URL for each environment (local, staging, production).
https://auth.nuxtjs.org/schemes/oauth2#options
In my nuxt.config.js I have:
authorization: process.env.AUTH_PROVIDER_URL + '/auth',
userInfo: process.env.AUTH_PROVIDER_URL + '/userinfo',
logout: process.env.AUTH_PROVIDER_URL + '/logout',
This works fine locally on my computer when I start the application in development (npm run dev) and production mode (npm run build, npm run start). The variables(authorization, userInfo and logout) for the urls get set correctly based on the process.env.AUTH_PROVIDER_URL statements.
But when I deploy and run it to the staging and production servers process.env.AUTH_PROVIDER_URL returns UNDEFINED. It seems “process.env” doesnt find the AUTH_PROVIDER_URL environment variable in the “auth” context in the nuxt.config.js file on the staging and production servers.
Using process.env like shown below in the nuxt.config.js files work both locally, on staging servers and on the production servers and the variables gets set correct.
export default {
auth_provider_url: process.env.AUTH_PROVIDER_URL,
publicRuntimeConfig: {
auth_provider_url: process.env.AUTH_PROVIDER_URL,
},
}
How come process.env works fine in this context in the nuxt.config.js file but not under the “auth” context in the nuxt.config.js?
Is it possible for me to access these variables under the “auth” section of the nuxt.config.js file?
What is the preferred/correct way to handle(use) environment variables under the “auth” section in the nuxt.config.js file?