Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

hot reload not working for lowercased components (Gatsby 3)

See original GitHub issue

Not sure if this is a duplicate of https://github.com/gatsbyjs/gatsby/issues/29952 or not, but it is very reproducible on Ubuntu 20.04 and Chrome.

Steps to reproduce:

with node v14.16.0 and yarn 1.22.10 install gatsby-cli globally
- yarn global add gatsby-cli@latest
create a blank gatsby project using the hellow-world starter
- gatsby new my-hello-world-starter https://github.com/gatsbyjs/gatsby-starter-hello-world
enter the src/pages folder and create a second page
- cd my-hello-world-starter/src/pages && cp index.js foo.js
start the development server
- cd ../.. gatsby develop
open http://localhost:8000/foo on the web browser (Chromium 89.0.4389)
edit the src/pages/foo.js page changing the text and save the file

Expected result:

The page rebuild and the web browser updates to display the new text.

Actual result:

The same unedited text is displayed

For the /src/pages/index.js the changes are reflected as expected.

Issue Analytics

State:
Created 3 years ago
Comments:5 (1 by maintainers)

Top GitHub Comments

2reactions

piehcommented, Mar 4, 2021

on further testing, we could reproduce less the issue when the export default function is named with a word starting with capital letter…

Ah, right - this is related to https://github.com/facebook/react/issues/17142 . We will see if we can implement some kind of warning for this (we already do have warning when export is unnamed or when there are multiple exports, but seems like we do miss case when component is named but doesn’t start with capital letter.

0reactions

github-actions[bot]commented, Jun 7, 2021

Hey again!

It’s been 60 days since anything happened on this issue, so our friendly neighborhood robot (that’s me!) is going to close it. Please keep in mind that I’m only a robot, so if I’ve closed this issue in error, I’m HUMAN_EMOTION_SORRY. Please feel free to comment on this issue or create a new one if you need anything else. As a friendly reminder: the best way to see this issue, or any other, fixed is to open a Pull Request. Check out gatsby.dev/contribute for more information about opening PRs, triaging issues, and contributing!

Thanks again for being part of the Gatsby community! 💪💜

Top Results From Across the Web

Hot Reloading Not Working · Issue #13918 · gatsbyjs/gatsby

I was importing components with their filename as uppercase (Dashboard via dashboard). Whilst they rendered fine hot-reload was not working.

Fast Refresh

Lowercase components like function example() {} cause Fast Refresh to not preserve local component state. Components and HOCs must be in PascalCase ....

Gatsby hot reloading does not reload in the Hello World ...

Gatsby Develop hot reload was not working whenever I made changes to files, plus, Gatsby Develop was terribly slow to compile code and...

Hot reloading not working : r/gatsbyjs

It may have something to do with where the sass is being imported. Are they directly in the component, or outside the layout,...

[Support Guide] Netlify app builds locally but fails on ...

Here is a guide to understanding how case sensitivity issues present themselves, why they arise ... Gatsby site fails to build on Netlify,...