Problem with url with instance in react using react-router

user_13321258 0
Viewed 182

I use react-router-dom in my React project and everything was fine until I add one more Route like this:

<Route path="/edit/:id" component={EditPage}/>

then i change Url in browser to http://localhost:8080/edit/123 then it's not render anything and in console it showed this warnings:

GEThttp://localhost:8080/edit/bundle.js
[HTTP/1.1 404 Not Found 19ms]

The resource from “http://localhost:8080/edit/styles.css” was blocked due to MIME type (“text/html”) mismatch (X-Content-Type-Options: nosniff).
123
The resource from “http://localhost:8080/edit/bundle.js” was blocked due to MIME type (“text/html”) mismatch (X-Content-Type-Options: nosniff).
123
The resource from “http://localhost:8080/edit/scripts/bundle.js” was blocked due to MIME type (“text/html”) mismatch (X-Content-Type-Options: nosniff).
123
Loading failed for the <script> with source “http://localhost:8080/edit/scripts/bundle.js”. 123:9:1
GEThttp://localhost:8080/edit/bundle.js
[HTTP/1.1 404 Not Found 3ms]

The resource from “http://localhost:8080/edit/bundle.js” was blocked due to MIME type (“text/html”) mismatch (X-Content-Type-Options: nosniff).
123
Loading failed for the <script> with source “http://localhost:8080/edit/bundle.js”.

can anyone help please ???

react-router reactjs javascript
2 Answers
http://localhost:8080/edit/bundle.js
[HTTP/1.1 404 Not Found 19ms]

This seems to indicate you are using a relative path as the path of the bundle.js in your index.html.

You should use absolute path for bundle.js in your index.html

Something like this:

<script src="/bundle.js"></script>

And not like this:

<script src="./bundle.js"></script>
user_66726790

I Added <base href="/" /> to head tag of html file and it worked.

user_133212580
Related