'File name differs from already included file name only in casing' on relative path with same casing
JavascriptWindowsTypescriptCompiler ErrorsJavascript Problem Overview
> Error TS1149: File name 'C:/Project/frontend/scripts/State.ts' differs from already included file name '../frontend/scripts/State.ts' only in casing.
I've triple checked the casing in our references and the actual files have the correct casing as well. As far as I can tell, this is solely because the relative path uses incorrect casing, or perhaps it's just because of the relative path itself?
The thing is, it compiles just fine on Mac and Linux, but throws this error on Windows.
If it helps, forceConsistentCasingInFileNames
is enabled in the tsconfig, and we're using tsify to compile.
Javascript Solutions
Solution 1 - Javascript
For me, the issue occurred when a file was quickly renamed from someFile.ts
to SomeFile.ts
. Restarting my IDE (Visual Studio Code) made the warning go away.
Solution 2 - Javascript
In my case, the error was in the import statement. The import statement had a capital letter instead of small letter, which worked during develop in Windows, but not when compiling for production.
wrong:
import {SomeClass} from '/some/path/SomeClass.ts';
correct:
import {SomeClass} from '/some/path/someClass.ts';
Solution 3 - Javascript
UPDATE 2021
That's a wired error that occurred in my IDE, but it can be simply done with two simple steps:
rename your file (not component) to another name and once again back to your original name.
Example:
consider we have a myFile.js
file in the components
directory:
> src
> components
> myFile.js
First
Rename myFile.js
into another name (anything) like temp.js
:
myFile.js ----> temp.js
Second
back to its original name,
temp.js ----> myFile.js
It's also work fine with *.ts *.tsx *.js *.jsx
extensions.
Solution 4 - Javascript
You need to disable the "forceConsistentCasingInFileNames"
in the tsconfig.json
file.
So you should have something like that:
{
"compilerOptions": {
...
"forceConsistentCasingInFileNames": false,
...
}
}
Solution 5 - Javascript
Restarting VS Code IDE didn't work for me and I didn't want to change config files. These are the steps that worked for me to resolve this problem:
- From VS Explorer, rename the problem file to a new name
- Change the component name to the new name inside the file
- Save the file
- Restart VS Code
- Rename the file back to the name I originally wanted
- Change the component name to match
It must be some kind of caching issue inside VS Code
Solution 6 - Javascript
For VS Code IDE users:
You can fix it by opening the Command Palette (Ctrl+Shift+P) --> Select Typescript: Restart TS server.
Solution 7 - Javascript
Mine was a vue problem, I removed the .vue extension and it worked
Solution 8 - Javascript
Ok, just need to throw in my "solution" here as well, since it was different from the others. The error message clearly said where it saw an error. It was the casing of a directory that had been renamed (from Utils -> utils). Even though it was renamed correctly everywhere I still got the error. My solution was to rename it once more (why not, hehe) to utils2. After that it worked fine
Solution 9 - Javascript
When two files exist in same folder with names like a.tsx and A.tsx you will get this error
Solution 10 - Javascript
For VS Code, only thing worked for me was to clear editor history:
- Press Ctrl + Shift + P.
- type command Clear Editor History.
- Press Enter.
Solution 11 - Javascript
I've tried these two ways:
-
Import file with '@/frontend/scripts/State.ts' instead of '../frontend/scripts/State.ts'. It works only if you are using path alias.
-
Rename the directory of the project and open the project from the new directory.
Solution 12 - Javascript
Changing "React" to "react" worked for me.
Incorrect:
import React from "React";
Correct:
import React from "react";
Solution 13 - Javascript
Writing the import again worked for me.
Solution 14 - Javascript
Remove .vue extension and it worked
Solution 15 - Javascript
If nothing works try:
- Remove node_modules
- Restart Vetur
yarn
ornpm i
again to get your node_modules- Restart developer window
Renaming files or restarting didn't help. The error started after renaming a file and letting Vetur do it's thing with imports.
Solution 16 - Javascript
In my case, I am using Nextjs. Removing the .next
folder and starting the app again solved the problem.
Update: The error occurred again. This time deleting .next didn't help. Turned out it was due to a circular dependency in my code.
Solution 17 - Javascript
For me the problem only went away:
- Close VS Code
- Deleting the node_modules\.cache folder.
- Re-open VS Code
Solution 18 - Javascript
The answer was that we were using tisfy 1.0.1, when forceConsistentCasingInFileNames
wasn't supported until 4.0.0. Updating fixed the issue.