Create-react-app: Inconsistent filename casing breaks the watcher

[thedjpetersen]

I am working on setting up a basic site on this and I want to split up my components into subdirectories. Do I have to eject and modify the webpack config to get the hot reloading working correctly?

[gaearon]

Not sure I understand. You should be able to create any number of subdirectories inside src.

[thedjpetersen]

Sorry I should have phrased it better. I am working on modularizing and I have tried to add things into their own subdirectories. When I save on any of these files though it doesn't seem to trigger a recompilation, only saves on the root level javascript files.

I was wondering if I needed to eject the config in order to get it to recompile on any save in the src/ directory and it's subdirectories.

[gaearon]

Everything inside src including subdirectories should be watched.

Is there any chance, however, that the name you’re importing has a different casing from the filesystem name?

For example, could it be that your file or directory is called something but you’re importing Something or vice versa? I’ve seen this trip the watcher.

[thedjpetersen]

Thanks! Should have looked a little closer - that was it.

[gaearon]

That’s our fault. We should warn/err in such cases, at least in user code.
It’s weird that webpack tolerates it.

[alexzherdev]

@gaearon were you thinking of something like this? https://github.com/Urthen/case-sensitive-paths-webpack-plugin

[gaearon]

This looks nice!
I’m not a big fan of the error message with the plugin name but I’d like to give this a try.
Would you want to submit a PR?

[alexzherdev]

Absolutely! I'll see if I can get it to work.

On Wednesday, 27 July 2016, Dan Abramov [email protected] wrote:

This looks nice!
I’m not a big fan of the error message with the plugin name but I’d like
to give this a try.
Would you want to submit a PR?

—
You are receiving this because you commented.
Reply to this email directly, view it on GitHub
https://github.com/facebookincubator/create-react-app/issues/240#issuecomment-235657771,
or mute the thread
https://github.com/notifications/unsubscribe-auth/AAFuONtnfJa1igZqtD5dKuZL5qXSTbZRks5qZ5R_gaJpZM4JWSYv
.

[gaearon]

This should be fixed in new version—we now should warn if you attempt to import a file with invalid casing. Can you please verify that this is fixed? Please find the upgrade instructions here.

[edmundtfy]

Somehow errors are showing up while I don't expect them to. Let me list out the steps:

• install create-react-app, create application, was working properly with npm run start and everything
• finished the app
• merge this new app into an existing git repo
  
  
  
  • method A: copy package.json, public/, src/, and yarn.lock to my current git repo folder. npn install && npm run start. works fine. then stop server with control+c. then I git checkout another branch and went back. and then npm run start and it's throwing error Error in multi main Module not found: [CaseSensitivePathsPlugin] '/Users/.../src/index.js' does not match the corresponding path on disk 'Index.js'.
  
  
  • method B: copy .git/ folder from my current repo to the original create-react-app folder. git commit and git push. works fine with npm run start. but when I stop dev server, git checkout other stuff and came back, it's also throwing the same error.
  
  

What I found:

• changing Index.js to index.js solves that error, but all other paths are broken. I haven't gone around to changing all my containers and components paths.