How to forbid replacing process.env variables during compilation in webpack?

Question

Story

I'm developing the AWS Lambda functions and compile the code using webpack.

I've read some of the articles and it seems that the process.env variables are auto replaced during compilation. Although it's cool I want to forbid this behaviour.

Why?

Because I'm passing environment variables using AWS Lambda dashboard.

Webpack configuration

const nodeExternals = require('webpack-node-externals')
const webpack = require('webpack')
const path = require('path')

module.exports = {
  target: 'node',
  entry: path.resolve(__dirname, 'index.ts'),
  externals: [nodeExternals()],
  devtool: 'inline-source-map',
  mode: 'production',
  module: {
    rules: [{
      test: /\.tsx?$/,
      use: [{
        loader: 'ts-loader',
        options: {
          experimentalWatchApi: true,
        },
      }],
    }]
  },
  plugins: [],
  resolve: {
    extensions: ['.tsx', '.ts', '.js']
  },
  output: {
    filename: 'index.js',
    libraryTarget: 'commonjs',
    path: path.resolve(__dirname, 'dist')
  }
}

Question

Is it possible to forbid the behaviour of replacing the process.env variables during webpack compilation? If yes please help me to achieve this effect.

Answer 1

Set optimization.nodeEnv to false

From:

https://webpack.js.org/configuration/optimization/#optimizationnodeenv

optimization.nodeEnv

boolean = false string

Tells webpack to set process.env.NODE_ENV to a given string value. optimization.nodeEnv > uses DefinePlugin unless set to false. optimization.nodeEnv defaults to mode if set, > else falls back to 'production'.

Answer 2

While setting optimization.nodeEnv to false works for the NODE_ENV variable, it doesn't work for all environment variables, and it doesn't prevent process.env from being replaced in the compiled code.

I'm working with Webpack on the backend, so having access during runtime is important.

Since there doesn't seem to be an official way of preserving process.env in the compiled code, I found this workaround, which worked for me.

I had to define a new global variable, which I called ENVIRONMENT, that will be replaced with process.env during compilation.

new webpack.DefinePlugin({
  ENVIRONMENT: 'process.env',
}),

In my code, I would then access it like a regular object:

ENVIRONMENT.DATABASE_URL

The above compiles to process.env.DATABASE_URL.