TypeScript File name differs from already included file name (Error TS1149)

[yoannfleurydev]

Hi everyone, I am struggling with some weird TypeScript behaviour at the moment, so I'm opening this discussion to seek for help. I don't know if this might be an issue, if there is any contributor reading this, feel free to convert this to an issue if it helps.

I'm using Next Auth with TypeScript, I did implement the GitHub provider and everything was smooth and working like a charm.

Now I try to implement the GitLab provider, and I have the following issue with TypeScript:

error TS1149: File name '/Users/yfleury/dev/start-repo/src/Providers.tsx' differs from already included file name '/Users/yfleury/dev/start-repo/src/providers.tsx' only in casing.

You can find a complete output through this link or in the detail below

Complete output of the `yarn tsc --noEmit` command input

yarn tsc --noEmit
yarn run v1.22.10
$ /Users/yfleury/dev/start-repo/node_modules/.bin/tsc --noEmit
src/pages/_app.tsx:10:27 - error TS1149: File name '/Users/yfleury/dev/start-repo/src/Providers.tsx' differs from already included file name '/Users/yfleury/dev/start-repo/src/providers.tsx' only in casing.
  The file is in the program because:
    Imported via "src/providers" from file '/Users/yfleury/dev/start-repo/node_modules/next-auth/providers/gitlab.d.ts'
    Imported via "src/providers" from file '/Users/yfleury/dev/start-repo/node_modules/next-auth/providers/gitlab.d.ts'
    Matched by include pattern '**/*.tsx' in '/Users/yfleury/dev/start-repo/tsconfig.json'
    Imported via '@/Providers' from file '/Users/yfleury/dev/start-repo/src/test/utils.tsx'
    Imported via '@/Providers' from file '/Users/yfleury/dev/start-repo/src/pages/_app.tsx'

10 import { Providers } from '@/Providers';
                             ~~~~~~~~~~~~~

  node_modules/next-auth/providers/gitlab.d.ts:3:56
    3 export default function GitLab(options: Partial<import("src/providers").OAuthConfig<any>>): import("src/providers").OAuthConfig<any>;
                                                             ~~~~~~~~~~~~~~~
    File is included via import here.
  node_modules/next-auth/providers/gitlab.d.ts:3:100
    3 export default function GitLab(options: Partial<import("src/providers").OAuthConfig<any>>): import("src/providers").OAuthConfig<any>;
                                                                                                         ~~~~~~~~~~~~~~~
    File is included via import here.
  tsconfig.json:25:43
    25   "include": ["next-env.d.ts", "**/*.ts", "**/*.tsx"],
                                                 ~~~~~~~~~~
    File is matched by include pattern specified here.
  src/test/utils.tsx:3:27
    3 import { Providers } from '@/Providers';
                                ~~~~~~~~~~~~~
    File is included via import here.

src/test/utils.tsx:3:27 - error TS1149: File name '/Users/yfleury/dev/start-repo/src/Providers.tsx' differs from already included file name '/Users/yfleury/dev/start-repo/src/providers.tsx' only in casing.
  The file is in the program because:
    Imported via "src/providers" from file '/Users/yfleury/dev/start-repo/node_modules/next-auth/providers/gitlab.d.ts'
    Imported via "src/providers" from file '/Users/yfleury/dev/start-repo/node_modules/next-auth/providers/gitlab.d.ts'
    Matched by include pattern '**/*.tsx' in '/Users/yfleury/dev/start-repo/tsconfig.json'
    Imported via '@/Providers' from file '/Users/yfleury/dev/start-repo/src/test/utils.tsx'
    Imported via '@/Providers' from file '/Users/yfleury/dev/start-repo/src/pages/_app.tsx'

3 import { Providers } from '@/Providers';
                            ~~~~~~~~~~~~~

  node_modules/next-auth/providers/gitlab.d.ts:3:56
    3 export default function GitLab(options: Partial<import("src/providers").OAuthConfig<any>>): import("src/providers").OAuthConfig<any>;
                                                             ~~~~~~~~~~~~~~~
    File is included via import here.
  node_modules/next-auth/providers/gitlab.d.ts:3:100
    3 export default function GitLab(options: Partial<import("src/providers").OAuthConfig<any>>): import("src/providers").OAuthConfig<any>;
                                                                                                         ~~~~~~~~~~~~~~~
    File is included via import here.
  tsconfig.json:25:43
    25   "include": ["next-env.d.ts", "**/*.ts", "**/*.tsx"],
                                                 ~~~~~~~~~~
    File is matched by include pattern specified here.
  src/pages/_app.tsx:10:27
    10 import { Providers } from '@/Providers';
                                 ~~~~~~~~~~~~~
    File is included via import here.


Found 2 errors in 2 files.

Errors  Files
     1  src/pages/_app.tsx:10
     1  src/test/utils.tsx:3
error Command failed with exit code 1.
info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.

The thing is, I have an src/Providers.tsx file in my project that I use to put some of my code, like Chakra UI Provider, React Query Provider and others.

Also, the GitLab Provider is importing type definitions from src/providers (and ./providers by the way, like GitHub Provider is doing).

next-auth/packages/next-auth/src/providers/gitlab.js

Line 1 in 7cf4956

/** @type {import("src/providers").OAuthProvider} */

To check if my theory was correct, I updated the generated types to replace:

export default function GitLab(options: Partial<import("src/providers").OAuthConfig<any>>): import("src/providers").OAuthConfig<any>;

with the same generated code than the GitHub adapter, and it works well:

export default function GitLab(options: Partial<import("./oauth").OAuthConfig<any>>): import("./oauth").OAuthConfig<any>;

So I'm wondering, is there a way to avoid name clashing (I don't really want to rename my file, but if it is the only way I'll do it)? Is it a mistake from the gitlab.js provider? Anything else?

Thanks a lot for your time and consideration, and thanks a lot to Next Auth maintainers, it is an awesome lib to work with.

[balazsorban44]

Could probably just turn that file into TS. Want to open a PR?

[yoannfleurydev]

Sure, I would love to help and contribute! I'll take a look in the next few days.

[yoannfleurydev]

There is some kind of a blocker to contribute to the project. I did follow the steps in CONTRIBUTING, and I am struggling with the compilation of the application pnpm dev. Either the contributing is not complete or I'm missing something.

Let me know if I should open a new issue for the behaviour just above.

[ThangHuuVu]

@yoannfleurydev you can just comment out that adapter block and the adapter usage to continue (we probably need another PR for this) 👍 The dev app is used differently by many people to reproduce issues so stuffs got turn on and off from time to time. It's OK to keep things locally for now.

[yoannfleurydev]

Yeah, thanks a lot, I did understand a bit later after my post. I did continue to read source code and successfully run the app to test my GitLab provider migration. Thanks a lot for your support.

[yoannfleurydev]

A PR to migrate the provider to TypeScript has been opened #4929