Import issue with Typesript

Hello,
I have a project that is configured like that:


-Root/:
    -tsconfig.json (1)
    -@app/
        -components/
            -src/
SharedLayout.tsx
-tsconfig.jon (2)
-client/
            -src/
                index.tsx

In the file index.tsx I have an import but it is not recognized and no completion:

In the (1) tsconfig.json I have the following

"baseUrl": ".",
"paths": {
"@app/*": ["@app/*"]
}
"references": [
{ "path": "@app/components" },

And in the (2) tsconfig.json I have the following:

"extends": "../../tsconfig.json",
"compilerOptions": {
"rootDir": "src",

"include": ["src/**/*.ts", "src/**/*.tsx"],

 

The issue is that I have to add "/src" to the import to have the completion working but it is working without the "/src" in other IDE.

Is it possible that Webstrom does not handle the "include" option?

 

4 comments
Comment actions Permalink

Not sure what "other editors" you refer to, but it definitely doesn't work in VSCode (unless your actual configuration differs from the one described above):

 

>Is it possible that Webstrom does not handle the "include" option?

it does handle it correctly for sure. Why do you think it's not handled?

0
Comment actions Permalink

I was referring to VS code, yes you have the same error with it but the completion is working without adding "/src"

 

I though it was the "import" option as the completion works  in VS code without the "src" but does not in Webstorm. Must be something else.

Here is the project that I try to use with Webstorm:
https://github.com/graphile/starter

0
Comment actions Permalink

>yes you have the same error with it but the completion is working without adding "/src"

 

in your project, the error comes from ESLint (import/no-unresolved rule), not from Typescript. In both VSCode and WebStorm, path is accepted by the Typescript language service. Completion will work in webstorm if you add

"types": "dist/index.d.ts"

to @app\components\package.json and build the app

 

0
Comment actions Permalink

Thanks a lot for your help!

It is a bit better with this but when I "ctrl + click" on SharedLayout it opens the file "@app\components\dist\SharedLayout.d.ts" instead of "@app\components\src\SharedLayout.tsx" which is not that practical.

For folder "@app\graphql" the option "types": "index.d.ts" is there but no completion.

Trying to figure out what is the difference with VS code...

0

Please sign in to leave a comment.