Unable to set $npm_package_version in the environment variables

Support
, , ,
1

I have a create-react-app (CRA) deployed and it uses dotenv to set up environment variables during development. One of the environment variables that my app relies on is defined as REACT_APP_VERSION=$npm_package_version and I tried to add this to the build environment settings page as with all the other environment variables I needed.

This particular variable however doesn’t behave as I expected it to. It is being treated as a string literal instead of being evaluated to the version defined on my project’s package.json file.

What should I do so that the $npm_package_version doesn’t get treated as a string literal and for it to be evaluated to something like 0.1.0 as defined in package.json?

2

I was able to fix this by injecting environment variables through local build plugins.

To illustrate my solution, here’s the file structure I made:

> project
  > plugins
    > netlify
      > env
        - index.js
        - manifest.yml
        - package.json ---> only for this plugin (to define as a module)
  ...
  - netlify.toml
  - package.json ---> need values from here
  ...

And to show my code:

index.js

export const onPreBuild = function ({ netlifyConfig, packageJson }) {
	netlifyConfig.build.environment.REACT_APP_NAME = packageJson.name;
	netlifyConfig.build.environment.REACT_APP_VERSION = packageJson.version;
};

manifest.yml

name: netlify-env

package.json (inside the plugins/netlify/env directory)

{
	"name": "netlify-env",
	"version": "1.0.0",
	"type": "module"
}

netlify.toml

[[plugins]]
package = "/plugins/netlify/env"

I hope this helps someone else so you don’t spend 2 days looking for answers.

3

Hey there, @dokgu :wave:

Thank you so much for coming back and sharing your solution! This will definitely help future netlify forums members who encounter something similar. Happy building :rocket: