Question posted in
Some documentation to get you started can be found here.

React app is looking for static files in different location when using proxy – Apache

I have used npx create-react-app my-app to create a react app.

The I used npm run build to build the app and deployed it using serve -s build

I’m using a proxy server to make my app publicly available.

My httpd configs looks like below,

/react_app http://192.168.1.100:3000

Whats really happening is once a request comes to http://<my public domain>/react_app I need to show my react app.

but the problem is it looks for the static files in http://<my public domain>/static/.. instead of http://<my public domain>/react_app/static/....

In my index.htmlI have set all absolute paths to relative paths as below,

ex:
<script src="./static/js/******.chunk.js"></script>
<link rel="manifest" href="./manifest.json"/>

But it didn’t fix my issue. Are there any way to solve my problem?

Tags:

3

Answers


  1. 0

    You have to add base tag(URL):

    <html>
<head>
   <base href="./react_app" target="_blank" />
</head>
...
</html>

    Some useful references on this – https://facebook.github.io/create-react-app/docs/deployment#building-for-relative-paths and the PUBLIC_URL https://facebook.github.io/create-react-app/docs/advanced-configuration.

    Login or Signup to reply.
  2. 0

    where did you store assets? If it is not the public folder, I think you should take a look at https://create-react-app.dev/docs/using-the-public-folder

    Login or Signup to reply.
  3. 0

    Building for relative paths for create-react-app

    There can be two places where you could define relative path

    1) By default, Create React App produces a build assuming your app is hosted at the server root.
    To override this, specify the homepage in your package.json, for example:

      "homepage": "http://mywebsite.com/react_app",

    This will let Create React App correctly infer the root path to use in the generated HTML file.

    2) If you are using react-router@^4, relative path can be set using basename

    <Router history={browserHistory} basename={'react_app'}>
  <Route path="/" component={App} />
</Router>

    Hope that helps!!!

    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search