Setting environment variable PUBLIC_URL does not set PUBLIC_URL on build

[webbushka]

Description

When using the PUBLIC_URL field in .env and then running npm run build the build succeeds but the PUBLIC_URL is not set. Seems that rescripts is ignoring the environmant variable. When setting homepage in package.json PUBLIC_URL is set. This works in a base react-scripts app as well as with react-scripts-rewired. But when moving to rescripts it no longer works.

@rescripts/[email protected]
@rescripts/[email protected]
[email protected]

Expected Behavior

URLs using the PUBLIC_URL variable should be set using the PUBLIC_URL environment variable.

Current Workaround

Add the url to your package.json as 'homepage'

[mpiorowski]

How do You send environment variable using rescripts?

[webbushka]

just create a .env file and they should get picked up, that's how it works with react-scripts.

[harrysolovay]

I love the OS community –– thanks for covering this issue @webbushka 👍

[jonathantneal]

Indeed! I believe this issue may be closed. 😄

[webbushka]

has something changed to pick up that var?

[jonathantneal]

Yes, the var does get picked up. 👍

I believe this issue can be closed. Looking back at your first message, is it possible you had accidentally defined the URL to PUBLIC_ENV instead of PUBLIC_URL?

Here are steps to demonstrate proper behavior:

# create an initial build from create-react-app
npx create-react-app my-app
cd my-app
echo "PUBLIC_URL=https://example.com" > .env
sed -i '' 's/\/build/# \/build/g' .gitignore
npm run build
git add .
git commit -a -m "npm run build"

# create a second build using rescripts
sed -i '' 's/  }/  },"rescripts": []/' package.json
sed -i '' 's/react-scripts /rescripts /g' package.json
npm install @rescripts/cli
npm run build
git add .
git commit -a -m "rescripts"

If you compare those last two commits, there will be no additional changes to the build directory, because the PUBLIC_URL var was properly read. To be extra sure, we can update that var:

# create a third build after updating the PUBLIC_URL
echo "PUBLIC_URL=https://cssdb.org" > .env
nom run build
git add .
git commit -a -m "PUBLIC_URL is cssdb.org"

Now, if you compare those last two commits, there will be several changes to the build directory, and all of the URLs will be updated from example.com to cssdb.org.

[jonathantneal]

Wait. Wait. Wait. Once I add "env", it does break. 😢

Adding a babel configuration breaks it as well. Seeing if it is limited to certain plugins.

It seems any plugin can break this functionality. I tried adding rescript-use-postcss-config since it would not touch anything related to babel. Puzzling.

[webbushka]

is it possible you had accidentally defined the URL to PUBLIC_ENV instead of PUBLIC_URL?

My bad, I updated the original comment. But yes I am using PUBLIC_URL

[jonathantneal]

Adding any rescript plugin seems to remove the ability to define both the homepage in package.json or the PUBLIC_URL in .env. I am experiencing no workaround.

[kamikazePT]

script on package.json -> "build": "node -r dotenv-flow/config 'node_modules/@rescripts/cli/bin/rescripts.js' build"

have fun, thats my dirty hack on projects using rescripts...

you need this https://www.npmjs.com/package/dotenv-flow

@jonathantneal

[goransh]

Any updates on this? I'm currently working on a project that has a different PUBLIC_URL set for dev (.env.development) and prod (.env.production). @kamikazePT's workaround does work, but I had to explicitly set node_env to production: node -r dotenv-flow/config node_modules/@rescripts/cli/bin/rescripts.js build --node-env=production

[kamikazePT]

@goransh good catch

yeah you need to set the node-env since only inside the build script those are being hardcoded, dotenv is running before so the NODE_ENV it uses is the one set globally in your system.

In my case it was okay because I was running the build inside a docker image, where I would set the NODE_ENV value through a build-arg in CI as an env value