Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Why the assets must be absolute path? #3986

Closed
rockmandash opened this issue Feb 6, 2018 · 3 comments
Closed

Why the assets must be absolute path? #3986

rockmandash opened this issue Feb 6, 2018 · 3 comments

Comments

@rockmandash
Copy link

Why the assets must be absolute path not relative path?
What exactly is the reason behind the scene?
Is react router not supporting relative path?
Or is webpack config not letting you use relative path?
Thank you.

@Timer
Copy link
Contributor

Timer commented Feb 6, 2018

React router cannot support relative paths -- that just breaks the idea of routing.

If you need relative paths, you can use the hash-router mode of React Router.

@Timer Timer closed this as completed Feb 6, 2018
@gaearon
Copy link
Contributor

gaearon commented Feb 6, 2018

To expand on this a little.. it’s not a React Router limitation. You just can’t have relative paths if you want to have client-side routing. Think about it: you want your app to load for arbitrarily nested URL like /todos/completed. If paths were relative, the browser would attempt to load JS from /todos/completed/static/js which wouldn’t work. And you can’t even use ../../ because URLs can be truly arbitrary. You don’t know in advance how many layers of nesting you need to “undo” to get to the JS asset root. And even if you calculated this, you can’t do this with a static HTML file.

So our default is to emit absolute paths. By specifying the homepage key in package.json you control the root URL prefix. For example if your app is hosted at /myapp. Finally you can force it to use relative paths by specifying "." as a homepage. This is kind of hacky but works. But as I explained above this would be incompatible with client-side routing, unless you stick with using hash-based approaches.

@rockmandash
Copy link
Author

@gaearon Your explanation is so clear ! Thank you.
@Timer Thank you for your explanation too !
Now I finally know the problem.

@lock lock bot locked and limited conversation to collaborators Jan 20, 2019
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
None yet
Projects
None yet
Development

No branches or pull requests

3 participants