Running locally only shows loading screen

[zhengkai2001]

Hi, I would like to run your awesome project using my Windows 10 laptop, but as the title says, it stays at the loading screen.

Things I did:

1. In the file "package.json", I changed the "scripts-clean" command from "rm -rf dist" to "del /q dist\*", which is the Windows' equivalent of that (if it is not changed, "npm start" would fail)
2. Created directory "dist" (if it is not manually created, "npm start" would fail)
3. npm install
4. npm start
5. In browser, visit http://localhost:3000/, and it stays at the loading screen.

In browser's console, it says "Cannot find module './Johann-Sebastian-Bach.png'." For me this is hard to understand, since why a ".png" file is a "module"...? I tried to copy the .png file to the root directory but it didn't help.

The browser is Firefox 58, and changing to Chrome didn't help (same error in console).

Since I'm quite new to nodejs, vue, webpack and everything, this question might be dumb but any help will be appreciated. Thank you!

[zhengkai2001]

Resolved.
Root cause: some musician portrait file names don't have correct uppercase/lowercase in \src\assets\images\musicians so these files cannot be found.
Solution: rename these files in \src\assets\images\musicians: Claude-Debussy.png, Johann-Sebastian-Bach.png and Ludwig-van-Beethoven.png. Then npm start will succeed.

[SuneBear]

Hello Zhengkai, I'm sorry for the late response. It's unfortunate that you got interrupted by this trouble with running on local. But your brilliant solution mentioned to me, before now, I never realized that there's a problem about case sensitivity in Git, which was caused by carelessness. Maybe typing, testing, and CI are necessary to cover all platforms for a stable project. Anyway, I fixed the names by the command git mv. Thanks for your feedback and enjoying it : )