GatsbyJS renders URLs incorrectly

I have my pages in "pages" folder called with lowercase names like this:

pages
├── 404.js
├── faq.js
├── addresses.js
├── service
│   ├── service1.js
│   └── service2.js
└── services.js

Gatsby should give them URLs associated with this lowercase names (like /services for pages/services.js), and it works in development mode, but in deployment mode (using netlify) it doesn't render the page and on reload changes URL to starting with uppercase (like /Services) and then it loads.

The strangest in it is that some pages work (like /faq, which is the exact duplicate of services.js with only function name changed) whilst others don't.

Code of services.js:

import React from "react"
...
function Services() {
  return (...)
}

export default Services

and code of faq.js:

import React from "react"
...
function Faq() {
  return (...)
}

export default Faq

All ... are the same in both files.

All pages are linked through Gatsby Links:

import { Link } from "gatsby"

Looking like this:

...
<div className="footer-column">
    <div className="footer-header">For clients</div>
    <Link to="/services/" className="footer-item"> // Problem one
      Our services
    </Link>
    <Link to="/faq/" className="footer-item"> // Working fine
      Frequently asked questions
    </Link>
</div>
...

Previously I created folder "services" and then renamed it to "service", maybe problem occurs here? But at the same time link to /addresses doesn't work too and there never was a folder called "addresses".

I tried setting up siteUrl in metadata, but it doesn't help.

How can i fix this problem?

Solution

I solved this strange problem.

For some reason files named with lowercase on my computer (displaying the same way) were starting with uppercase in git. So if you got it too, check filenames in GitHub or any other git platform you use.