gatsby-plugin-page-creator creating pages with paths differently cased to the filesystem

[jradikal]

Description

gatsby-plugin-page-creator is creating pages with a lowercase path however my filesystem uses some uppercase paths.

Steps to reproduce

just run gatsby develop on https://github.com/jradikal/jaredsmith.tech, however I'm not sure that this would happen to everyone, I'm currently on windows 10 x64

Expected result

gatsby develop should compile with no errors

Actual result

the error on multiple pages:

warning The plugin "gatsby-plugin-page-creator" created a page with a component path that doesn't match the casing of the actual file. This may work locally, but will break on systems which are case-sensitive, e.g. most CI/CD pipelines.

page.component: "C:/users/jared/desktop/test/jst/src/pages/posts/projects.js" path in filesystem: "C:/Users/jared/Desktop/test/jst/src/pages/posts/projects.js"

Environment

System: OS: Windows 10 CPU: (8) x64 Intel(R) Core(TM) i7-2630QM CPU @ 2.00GHz Binaries: Yarn: 1.13.0 - C:\Program Files (x86)\Yarn\bin\yarn.CMD npm: 6.4.1 - C:\Program Files\nodejs\npm.CMD Languages: Python: 2.7.16 - /c/Python27/python Browsers: Edge: 42.17134.1.0 npmPackages: gatsby: ^2.3.29 => 2.3.29 gatsby-image: ^2.0.40 => 2.0.40 gatsby-plugin-manifest: ^2.0.29 => 2.0.29 gatsby-plugin-offline: ^2.0.25 => 2.0.25 gatsby-plugin-react-helmet: ^3.0.12 => 3.0.12 gatsby-plugin-sharp: ^2.0.35 => 2.0.35 gatsby-source-filesystem: ^2.0.32 => 2.0.32 gatsby-transformer-sharp: ^2.1.18 => 2.1.18

[jradikal]

Ok having tried a lot of different options, it seems to be the fact I was using powershell to run "gatsby develop", this seems to be causing my file path to be all over the place (This is native to windows and the ntfs file system and the fact that windows does not care for a case sensitive path). I changed to cmder and this resolved the issue.

[nugoo1]

How do u do that?

[jradikal]

Do what my dude? If you are having this issue make sure to not use powershell, I'm sure there is a way around it but just easier to switch shells

[nugoo1]

Got the issue fixed man.. Realised there was a copy of desktop on my new windiws 10 and the actual desktop is within OneDrive folder.. All good now, but netlify throwing an error on creatingPages for some reason, unrelated to this..

[ryolambert]

@jradikal I've had the exact same warning/error issues, but had no problems with gatsby builds/develop commands until this last week when I updated the gatsby-cli on my laptop. The weirdest part is the problem still persists whether I'm using powershell or the command prompt terminal. It seems to run fine using git bash, but even weirder is everything works fine on my desktop using my exact same powershell setup through conemu...

[jradikal]

@ryolambert I believe conemu uses git bash so that should not cause issues :) Command prompt is native windows so same applies (windows does not care for the file path case). Try cmder, that's what I use and that solved the problem as it's running bash. Unfortunately this is just the way windows runs :(

[ryolambert]

@Jradikal I can get it to work using git bash via conemu, it’s just driving me insane why this seems to be working via powershell/conemu on my desktop computer, but breaks on my laptop. And mind you I didn’t encounter any of the pathing issues until I made an update with the Gatsby-cli. It’s just frustrating having my powershell terminal customized and have to ditch it because of a dumb window/ntfs pathing issue!!! (ノ´༎ຶོρ༎ຶོ`)ノ彡┻━┻

[jradikal]

@ryolambert I completely hear you on this one, I was literally trying to learn Powershell at the same time as Gatsby... I was stuck ion this one for a long time, maybe there is a way to set Powershell to convert the file path? I'm really not too sure on this but worth a look

[jannikbuschke]

I am seeing this error in Azure Devops. Locally builds work. This happened after updating some dependencies:

   "@mdx-js/mdx": "1.4.4",
    "@mdx-js/react": "1.4.4",
    "@mdx-js/tag": "0.20.3",
    "antd": "3.23.1",
    "gatsby": "2.15.7",
    "gatsby-cli": "2.7.44",
    "gatsby-image": "2.2.17",
    "gatsby-plugin-manifest": "2.2.14",
    "gatsby-plugin-mdx": "1.0.39",
    "gatsby-plugin-offline": "3.0.3",
    "gatsby-plugin-react-helmet": "3.1.6",
    "gatsby-plugin-sharp": "2.2.20",
    "gatsby-plugin-typescript": "2.1.6",
    "gatsby-remark-autolink-headers": "2.1.9",
    "gatsby-remark-images": "3.1.20",
    "gatsby-remark-katex": "3.1.7",
    "gatsby-remark-prismjs": "3.3.12",
    "gatsby-source-filesystem": "2.1.21",
    "gatsby-transformer-json": "2.2.7",
    "gatsby-transformer-remark": "^2.6.21",
    "gatsby-transformer-sharp": "2.2.13",
    "katex": "0.11.0",
    "prismjs": "1.17.1",
    "react": "16.9.0",
    "react-dom": "16.9.0",
    "react-helmet": "5.2.1",
    "react-responsive": "6.1.1",
    "react-sizeme": "2.6.7"

[jradikal]

@jannikbuschke I dont know much about azure devops, however same principal would probably apply, it's a Microsoft product, hence the file paths probably work the same as command prompt.

[jannikbuschke]

I think I ran into this issue: #16721. Ill track it there...

[matthiasguentert]

Ok having tried a lot of different options, it seems to be the fact I was using powershell to run "gatsby develop", this seems to be causing my file path to be all over the place (This is native to windows and the ntfs file system and the fact that windows does not care for a case sensitive path). I changed to cmder and this resolved the issue.

This also seems to happen when running cmd inside Visual Studio Code... very strange... outside VSCode everything is okay (when running from cmd instead of pwsh)

[Sean-93]

Does this actually cause any issues, or will it only cause issues for specific cases? Mine gives this issue, but it builds and serves fine.

[Mvrs]

Ok having tried a lot of different options, it seems to be the fact I was using powershell to run "gatsby develop", this seems to be causing my file path to be all over the place (This is native to windows and the ntfs file system and the fact that windows does not care for a case sensitive path). I changed to cmder and this resolved the issue.

Thanks man this actually worked. Sadly, it's broken on WSL and poweshell it seems 😞

[claudemahon]

Might be a little late to the party, but if your using Bash through Vs Code, make just that you follow the exact file path for the file system. Doing so fixed my issue. hope this helps.

[Aron-HD]

I fixed this issue by cding back out of the given project directory and cd there with the correct capitalisation of folders in the terminal before running develop again, i.e:

~/Path/To/project/...
cd ..
~/Path/To
cd Web
~/Path/To/Project/...

[davidmgarrett]

I was able to solve this by setting each task's working folder:

launch.json:

"configurations": [
    {
        "type": "pwa-chrome",
        "request": "launch",
        "name": "Debug Website",
        "url": "http://localhost:8000",
        "webRoot": "${workspaceFolder}",
        "preLaunchTask": "start-dev-server"
    }
]

tasks.json

"tasks": [       
    {
        //required for onPostBuild to copy static files
        "label": "build-dev-server",
        "type": "npm",
        "script": "build",
        "isBackground": true,
        "options": {
            //required for powershell casing issue with gatsby
            "cwd": "C:/projects/test-project1/src"
        },       
    },
    {
        "label": "start-dev-server",
        "type": "npm",
        "script": "start",
        "isBackground": true,
        "options": {
            //required for powershell casing issue with gatsby
            "cwd": "C:/projects/test-project1/src"
        },
        //allows chrome to launch when this finishes
        "problemMatcher": {
            "owner": "npm",
            "background": {
                "activeOnStart": true,
                 "beginsPattern": ".*",
                 "endsPattern": "success Building development bundle.+"
            },
            "pattern": {
                "regexp": "",
            }
        },
        "dependsOn": "build-dev-server"
    },
]

package.json:

"scripts": {
   "start": "gatsby develop",
   "build": "gatsby build",
   "format": "prettier --write src/**/*.{js,jsx}",
   "serve": "gatsby serve"
}