Docz: Navigation via url/refresh/link other than sidenav does not work in production mode.

Created on 18 Jul 2018  路  6Comments  路  Source: doczjs/docz

Bug Report

When the project has been built for production using yarn docz build navigation only works through the side bar. When trying to link between pages using markdown links, or refreshing the page, the site 404's.

To Reproduce
Here is what I used to test -
First I load the typography page successfully by using the sidebar nav, it loads successfully.
Next I try to refresh the page and it 404's.
Then I navigate to the colors page and it loads successfully.
Next I try to refresh the page and it 404`s.

[Wed Jul 18 2018 14:29:58 GMT+0100 (BST)] "GET /static/js/docs-1-brand-2-typography.js" "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_13_4) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/67.0.3396.99 Safari/537.36"
[Wed Jul 18 2018 14:30:04 GMT+0100 (BST)] "GET /brand/typography" "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_13_4) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/67.0.3396.99 Safari/537.36"
[Wed Jul 18 2018 14:30:04 GMT+0100 (BST)] "GET /brand/typography" Error (404): "Not found"
[Wed Jul 18 2018 14:30:31 GMT+0100 (BST)] "GET /brand/colors" "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_13_4) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/67.0.3396.99 Safari/537.36"
[Wed Jul 18 2018 14:30:31 GMT+0100 (BST)] "GET /brand/colors" Error (404): "Not found"

Expected behavior
That the routes are served so they can be accessed from anywhere, not just from the sidebar navigation.

Enviroment

  • OS: OSX 10.13.4
  • Node/npm version: Node 9, NPM 5
  • Docz Version: 0.5.9
bug

Most helpful comment

@pedronauck
i think this might still exist in prod mode.

hosting the dist using http-server and hitting abc.com/getting-started will return 404. hitting abc.com without the path works though.

im using v1 rc7

All 6 comments

Not to piggy-back on all your issues, but in development mode, it does a full page refresh, whereas the sidebar triggers a rerender. Could be related.

I think that it's a problem related to this issue: #25
Some solution is set the hashRouter property on your config to create a hash navigation, or you can configure your static server to redirect always to your index.html

To link documents on your markdown, you need to use the docz Link component

import { Link } from 'docz'

<Link to="/some/path">my link</Link>

I'm really like this post that explains very well about this
https://tylermcginnis.com/react-router-cannot-get-url-refresh/

To link documents on your markdown, you need to use the docz Link component

It might be nice to enable internal linking with standard Markdown. I noticed the docz site itself does full page reloads when linking in the content.

Yes, docz site has full page reload because we are doing an index.html redirecting using Netlify @mAAdhaTTah

Switching from using Markdown links to <Link> fixes the issue.
I have also applied the same netlify.toml from the docz site to do the index.html redirect and that sorts out the refresh :)
Not sure that is really a solution, but it works for me.

@pedronauck
i think this might still exist in prod mode.

hosting the dist using http-server and hitting abc.com/getting-started will return 404. hitting abc.com without the path works though.

im using v1 rc7

Was this page helpful?
0 / 5 - 0 ratings

Related issues

w0wka91 picture w0wka91  路  3Comments

danburzo picture danburzo  路  3Comments

merelinguist picture merelinguist  路  3Comments

regrettably picture regrettably  路  3Comments

fenbka picture fenbka  路  3Comments