Env vars client side prod server

default discord avatar
eddieDev
4 weeks ago
9

Hello, I've already tried adding

dotenv.config()

and/or


dotenv.config({path: path.resolve(__dirname, '../.env'),});

However, with the variables having

PAYLOAD_PUBLIC

in front, it still returns

undefined

.


Prod server is using

yaml

, not

env

.


What would the best solution here be? I'm suspecting

.env vars

are needed when it builds, but we can't work like that. Should I just make an

api

endpoint to server the payload public

env vars

?


Ty.

  • default discord avatar
    thisisnotchris
    4 weeks ago

    @eddieDev One option is extending the exposed webpack configuration



    And using the webpack env variable plugin



    May work with YAML config?

  • default discord avatar
    eddieDev
    4 weeks ago

    hey @thisisnotchris something like this?


    // customAdminBuild.js const path = require('path'); // Tell Payload where to find your Payload config - can do it either here, or in package.json script process.env.PAYLOAD_CONFIG_PATH = path.resolve(__dirname, 'src/payload.config.ts'); const { build } = require('payload/dist/bin/build'); const buildPayloadAdmin = async () => { // Fetch your environment variables here // And then run

    build

    build(); } buildPayloadAdmin();
  • default discord avatar
    thisisnotchris
    4 weeks ago

    hmmm



    It's worth a shot! I'm not super familiar with yaml

  • default discord avatar
    eddieDev
    4 weeks ago

    unfortunately, after some research, this wont work since we cant add env variables during the build. It is added after the build. 😦

  • default discord avatar
    thisisnotchris
    4 weeks ago

    @eddieDev but surely you can import the vars right?

  • default discord avatar
    eddieDev
    4 weeks ago

    hey @thisisnotchris . I couldn't apply the above since we build first and add env vars later. I Tried various things and came up with a solution. What I landed on was setting up a route to the backend to get the payload_public env var that I needed, then persisted the data using localStorage in the frontend. Not ideal, but it will do.

Open the post
Continue the discussion in Discord
Like what we're doing?
Star us on GitHub!

Star

Connect with the Payload Community on Discord

Discord

online

Can't find what you're looking for?

Get help straight from the Payload team with an Enterprise License.