I get a 'Failed to load resource: net::ERR_FILE_NOT_FOUND' in index.html dist folder

[codestitch]

After doing npm run dist and then opening index.html in dist folder I got the error 'Failed to load resource: net::ERR_FILE_NOT_FOUND'.

project url: https://github.com/codestitch/dashboard-material

i check on the network (inspect element) and i guess it didn't find app.js.

Please help me w/ the issue.

Thank you

[codestitch]

I also tried to create a new project and use the generator. After that I run npm run dist and open index.html at dist folder and got the same issue.

Is there anything I would do before running dist?

Thank you.

[stylesuxx]

Are you serving the file properly, or just accessing it via file browser?

you can serve your dist files by running npm run serve:dist

If you want to serve your app from github you can do this by using the gh-pages branch and deploying the content of your dist directory there.

I did it here the exact same way with a project of mine. This is what the gh-pages branch should look like, and the result on stylesuxx.github.io/LiftOff-Track-and-Race-Generator.

[codestitch]

Hi sir @stylesuxx. Thank you for responding to my issue. I am newbie reactjs, redux and setup.

Yes, after running npm run dist I open the file (index.html) via browser (chrome) and got this result:

and also in my public server:

I was thinking that when you run npm run dist your project will be compiled and minified and then you can run it on browser or put it in the server and then run it (like in my public server) like what is stated in yeoman website.

[stylesuxx]

If you are not serving from the top level (you are in a folder), you need to adjust the path to app.js in index.html

Change this line: <script type="text/javascript" src="/assets/app.js"></script>

to this: <script type="text/javascript" src="./assets/app.js"></script>

this way it will import relative to your index.html

Do the same with the path to the favicon.

[codestitch]

I changed it to <script type="text/javascript" src="./assets/app.js"></script>

but still got a blank page.

I should be seeing this.

[stylesuxx]

I just cloned your repo, adjusted the path, ran npm run dist npm run serve:dist

Also tried serving it with python one liner (from within the dist folder): python -m SimpleHTTPServer 12345

and it is behaving as expected.

Might be an issue with the router when the app is not properly served. You are only accessing it via file browser and not serving it.

[codestitch]

What do you suggest sir to do? I'm bit confused because when I debug the app via npm run serve it works fine.

[stylesuxx]

Well, like I said before, simply serve it any way you want and you should be OK. I do not know your setup, but I provided a solution to serve it with python. As long as your path is correct you should be able to serve it with any http server...

[codestitch]

Hello sir.

I tried to create a fresh new react-webpack-redux project and there something I notice with routing w/c I don't have idea how to solve.

First scenario: Without Router Compilation. Compiled using npm run dist. Copied the files from dist folder and placed in my htdocs in my public server (using xampp).

works fine. Also works fine in my local Drive C:

Now when I use React-Router (I followed in your wiki - added IndexRoute).

It worked on localhost:8000 w/ the command npm run serve. It worked on localhost:8000 w/ the command npm run serve.

Now when I compile to production. npm run dist and then same thing copy the files from /dist folder and place in my public server (same as the first scenario) inside htdocs folder.

It won't run. Same in my local drive.

Am I missing something when using Routes? Or do i need to configure something in my public server (I'm using xampp).

I hope you can help me on this.

Thank you.

[codestitch]

Hi. I was able to fix the problem by using

const browserHistory = useBasename(createHistory)({ basename: "/myapp" });

Though I'm still having problems with browserHistory.push('/') or browserHistory.push('/myapp'), because it is not redirecting to home page after login.

Anyway, thank you. The problem for this issue is fixed.

[mr-palindrome]

Hii, I'm also getting the same problem!! Please help me out... The image bg.png is not visible!! Showing the same error "Failed to load resource: net::ERR_FILE_NOT_FOUND".

[Mahmoud-farargy]

I have the same problem, I followed tutorials and step by step guides but it still doesn't work with me. Please help!!