0

I have been trying to use publicRuntimeConfig / privateRuntimeConfig On nuxt 2.4.1, I have defined my runtime config as follows on nuxt.config.js

publicRuntimeConfig: {
    DATA_API_HOST_URL: process.env.VUE_APP_DATA_API_HOST_URL,
  },
  privateRuntimeConfig: {
    AUTH_APP_CLIENT_SECRET: process.env.VUE_APP_AUTH_APP_CLIENT_SECRET,
  },

and calling it as follows on my login.vue

asyncData( ctx ) {
  console.log(ctx.$config.DATA_API_HOST_URL)
  //some activity
}
  1. The keys are showing up on $config inside asyncData. I debugged on chrome dev tools. But value is not read from process.env.VUE_APP_DATA_API_HOST_URL. The value is showing up as undefined. However, process.env.VUE_APP_DATA_API_HOST_URL is showing the value OK. The whole point is to move away from process.env.
  2. this.$config.DATA_API_HOST_URL also does not access the values.
  3. '${DATA_API_HOST_URL}' is shown in examples but I believe it is only for explicit param declarations at asyncData like asyncData( { $config : {DATA_API_HOST_URL}).
  4. When I pass values as it is using DATA_API_HOST_URL: process.env.VUE_APP_DATA_API_HOST_URL || 'https://test.api.com', it seems to copy the value fine using ctx.$config.DATA_API_HOST_URL!

Looking to me like copying process.env to *RuntimeConfig has a problem!

What is the recommended way of importing and using runtime configurations?

Naveen Karnam
  • 433
  • 2
  • 9
  • 26

2 Answers2

1

As per documentation in the Nuxt blog post you marked, the feature your are trying to use is released in 2.13 (you´re using 2.4 if i not misunderstood). That could be the reason behind the behaviour you're seeing. I'd recommend update your project dependencies or trying another approach.

Oscar Cero Uno
  • 54
  • 7
-1

I think you should use Docker to set dynamic runtime config like link below:

https://dev.to/frontendfoxes/dockerise-your-nuxt-ssr-app-like-a-boss-a-true-vue-vixens-story-4mm6

soroush
  • 742
  • 6
  • 10
  • Even for dockerizing, I would need to be able to read the configuration from within the app / context. And we may not want to hard-code like I'm doing in the work around (step 4). – Naveen Karnam Aug 13 '20 at 09:31
  • I seem don't see any dynamic runtime configure as in the provided post link, it's just a generalize dockerize the nuxtjs to a container, I don't see any passing link parameter or environment variable from docker-compose to nuxtjs, can you clarify the point as per the question? – Osify Apr 01 '21 at 09:14