PUBLIC URL reference gets added twice in the CRA build, static resources fails to load

[Dip686]

Website created using CRA. To build a feature branch running this command. export PUBLIC_URL=pr-preview/pr-${{ github.event.number }} && npx react-scripts build. In the build file, index.html It is already adding pr-preview/pr-number before static resource path. But while loading, it is referring to the path twice (attached screenshot).

[rossjrw]

You are referencing your scripts with relative paths e.g.:

<script src="pr-preview/pr-8/static/script.js"></script>

A script src that doesn't start with a slash is relative to the current path: https://developer.mozilla.org/en-US/docs/Learn/Common_questions/What_is_a_URL#absolute_urls_vs_relative_urls

The current path is /pr-preview/pr-8/, so that would resolve to /pr-preview/pr-8/pr-preview/pr-8/static/..., as you experienced.

To access https://<domain>/pr-preview/pr-8/static/script.js from /pr-preview/pr-8/, your script src needs to be either /pr-preview/pr-8/static/script.js (with a leading slash to make it absolute with an implicit domain), or static/script.js (without a leading slash, to be relative to the current path).

I haven't used create-react-app or even React, so unfortunately I can't help you achieve that in that framework. You might have some luck just adding a leading slash to your PUBLIC_URL, i.e. PUBLIC_URL=/pr-preview/pr-${{ github.event.number }}

[rossjrw]

Noting that I'm closing this issue as it's not a bug with this Action, but please feel free to respond and I'll help as best I can.