Environment Variable is good for build time variable. Use runtimeConfig for runtime environment variable.
publicRuntimeConfig: accessible from both client and server using$configprivateRuntimeConfig: accessible from server only using$config
Edit nuxt.config.js
export default { publicRuntimeConfig: { DATA_SOURCE: process.env.DATA_SOURCE || 'json' },}You can pass process.env.DATA_SOURCE via npm package.json.
Edit package.json.
{ "scripts": { "dev": "env DATA_SOURCE=local nuxt", "build": "env DATA_SOURCE=firestore nuxt build", "generate": "env DATA_SOURCE=local nuxt generate", },}Access config in code
<template> <div> Data Source: $config.DATA_SOURCE </div></template><script>export default { data() { return { dataSource: this.$config.DATA_SOURCE } }}</script>Access config in plugins
export default async ({ app, store, $config }, inject) => { console.log('DATA_SOURCE', $config.DATA_SOURCE)}