Hot reloading sub-components

[jonaswindey]

When you have a page test.js in /pages, only changes to that file will be hot-reloaded.

If you have a file child.js and load this from test.js, any changes to child.js will not be hot reloaded.

test.js

import React from 'react'
import Child from './child'

export default () => <div>hello <Child /></div>

child.js

import React from 'react'

export default () => <div>world</div>

[lipp]

You should keep you (reusable) sub-components in your own "components" dir, parallel to the "pages" dir.
Just as this example does.
If you stick to this, the hot-reloading works just fine.

[jonaswindey]

Yep, I know. It works for all files except for the files that are under /pages (and that aren't called directly as a page url)

You're not forced to use 'components' but it just can't be inside the pages folder. Any reason why there is this limitation?

[rauchg]

There shouldn't be such a limitation, and this issue is legitimate. Thanks @jonaswindey