Static GitHub Issues

[1013] Access env in Plugin

prev: keep-alive activated and deactivated hooks not working
next: RangeError maximum calls stack size exceeded

Hey, I wonder how to access the environment process.env.MY_VAR inside a Plugin on frontend and backend.

We can't access process.env inside the browser which is intended, so I just throw it into the nuxt.config.js under "env". Then I should be able to access it in the plugin too. But here comes the tough part. I need to export an object and not an function in my case, but the env is only available through the dependency injection which needs a function parameter.

How can I export my object instead of the function?

Before (I can access the feathers object but the process is not available on the client)

import hooks from 'feathers-hooks'
import authentication from 'feathers-authentication-client'
import storage from '~helpers/ssr-storage'

const host = process.env.API_HOST || 'http://localhost'
const port = process.env.API_PORT || '3030'
const socket = io(`${host}:${port}`)

const app = feathers()
  .configure(socketio(socket))
  .configure(hooks())
  .configure(authentication({storage}))

export default app

After (throws an error as the object is now the method that I can`t call without having the env to pass)

import hooks from 'feathers-hooks'
import authentication from 'feathers-authentication-client'
import storage from '~helpers/ssr-storage'

export default function ({app, env}) {
  console.log(env)
  let endpoint = `http://${env.API_HOST}:${env.API_PORT}`
  console.log(endpoint)

  let api = feathers()
  api.configure(socketio(io(endpoint)))
  api.configure(hooks())
  api.configure(authentication({storage}))

  app.feathers = api

  return api
}

Has anyone an idea how to accomplish this?

<!--cmty--><!--cmty_prevent_hook--><div align="right"><sub><em>This question is available on <a href="https://nuxtjs.cmty.io">Nuxt.js</a> community (<a href="https://nuxtjs.cmty.io/nuxt/nuxt.js/issues/c881">#c881</a>)</em></sub></div>