What is the suggested way of setting ENV variables that are expected to show up in process.env?

[demitrious-tom]

I looked over the Shakapacker v7 guide as well as the example applications, but I didn't see any mention on how to set environment variables (i.e process.env.IMPORTANT_VAR) for a react application that rails also needs access to. Is there currently a prescribed approach to accomplishing this?

[ahangarha]

Just define your env variable as you do usually. There shouldn't be any issue unless you are talking about a very specific feature. In this case, a detailed proposal can be a good start.

[demitrious-tom]

"Just define your env variable as you do usually"

Well usually I would define them in my encrypted credentials file and retrieve them in my rails code like

Rails.application.credentials.important_var

I suspect that would not make them automatically available in the process.env object, or am I wrong.

[Judahmeek]

@demitrious-tom you're right that won't work.

Your options are to either pass the value as props to your bundled application or to use a webpack loader, such as https://webpack.js.org/plugins/define-plugin/, to set those environment variables at compile-time.

[demitrious-tom]

That sounds like what I used to do, that worked, but I was not sure if that was the "correct way" of doing it. for example:

In this case lets say I am in my development environment I would do the following

//config/webpack/development.js

const ReactRefreshWebpackPlugin = require('@pmmmwh/react-refresh-webpack-plugin');
    clientWebpackConfig.plugins.push(
      new ReactRefreshWebpackPlugin({
        overlay: {
          sockPort: devServer.port,
        },
      }),
      new webpack.ProvidePlugin({process: 'process/browser.js'}),
      new webpack.EnvironmentPlugin( { ...process.env } ),
    );

//config/initializers/shakapacker.rb
Shakapacker::Compiler.env['AWS_XXXXXXX'] = Rails.application.credentials.dig(:aws_xxxxxxx)

[demitrious-tom]

Though since upgrading to react_on_rails the values in the initializer (that come from the encrypted credentials) don't show in process.env.AWS_XXXXXXX only the values in the .env files. This was the reason I was wondering what the suggested approach was.