5

I recently created a website with create-react-app. Since this is not a web app, why do I need a server to see it? I tried to open the index file in build folder but it doesn't work unless I'm serving it from a server.

ocram
  • 1,384
  • 6
  • 20
  • 36
  • Look in the console. – SLaks Jun 13 '17 at 20:24
  • 1
    [You don't](https://github.com/facebookincubator/create-react-app/blob/master/packages/react-scripts/template/README.md#deployment). – Fabian Schultz Jun 13 '17 at 20:27
  • @FabianSchultz: That's still a server. – SLaks Jun 13 '17 at 20:27
  • You need a server to provide the other static content in the build directory e.g. bundle.js, css files etc. If I open up the index file without a server (e.g. file:////index.html, it can't find the other files. – Martin Jun 13 '17 at 20:32
  • yeah but why? thats still static js code, why doesnt it load unless served by a server? – ocram Jun 13 '17 at 20:33
  • It's a path issue. In the test I just did it is search for the static folder in file:///static i.e. it has lost the route path of where the index.html file is located. – Martin Jun 13 '17 at 20:38

1 Answers1

5

You can set the homepage root url in the package.json file e.g.

{
   ...,
   "homepage":"file:///<path to build directory"
}

npm run build

This will now find the static content in the build directory from the file system without a server.

Martin
  • 7,089
  • 3
  • 28
  • 43
  • Can you explain a little in detail about where to write ("homepage":"file:/// – Prakhar Mittal Aug 23 '18 at 07:20
  • 3
    @PrakharMittal The original question was why can't you just open the index.html file in the build directory (produce by `npm run build`) with a browser and everything just work i.e. no server. This doesn't work because it tries to load the static files from the root of your file system. If you put the above homepage argument in the package.json file it will work. The path needs to be an absolute path to the build directory e.g. if you run `npm run build` in /home/prakhar/myproject, you would set homepage to /home/prakhar/myproject/build in your package.json. – Martin Aug 24 '18 at 20:38
  • @Martin. I tried giving the path as you suggested. But it still is not working for me. I gave the paths as : "homepage":"build", "homepage":"/build", "homepage":"C:/Office/Prototype/build" But it was not under (dependencies or scripts). It was written independently. – Prakhar Mittal Sep 03 '18 at 06:44
  • this question needs more answers, how will I get the absolute path if my app is hosted on the server? you should mention that this will only work if you're running it on your local machine, if not, then you should not set the homepage argument since the hosting provider server will *serve* your ./build files for you. – Ekmek Feb 26 '21 at 09:55
  • It seems like that path doesn't have to be absolute. The absolute path worked for me, but the relative one also worked, i.e. ```"homepage":"./"``` – Mohammed S. Yaseen Oct 15 '21 at 10:03