Typescript does not resolve modules through tsconfig.json's baseUrl

My tsconfig.json:

{
"compilerOptions": {
"module": "es6",
"target": "es6",
"lib": ["dom", "es2016"],
"moduleResolution": "node",
"baseUrl": "src",
"allowSyntheticDefaultImports": true,
"noImplicitAny": false,
"sourceMap": true,
"jsx": "preserve"
},
"files": [
"typings/Core.d.ts"
]
}

 

My project structure:

- node_modules/
- scripts/
- src/
- components/
- services/
- typings/
- www/
- tsconfig.json

 

Whenever I create a component and try to import a service like this:

import { logout } from 'services/authentication/index';

I get an error: 

TS2307: Cannot find module 'services/authentication/index'

Even though simply compiling the Typescript through the CLI works fine. 

 

23 comments
Comment actions Permalink

You can also see error like:


Warning:Cannot find parent tsconfig.json

Right? WebStorm does support 'baseURL' and correctly generates/resolves imports using it.

The problem is that you have "files":[] section that only includes a file from typings.

If there is a 'files' section in tsconfig.json, WebStorm applies config settings to a file only if it is included in this section (tsc, BTW, works in the same way - see http://www.typescriptlang.org/docs/handbook/tsconfig-json.html):

If the "files" and "include" are both left unspecified, the compiler
defaults to including all TypeScript (.ts, .d.ts and .tsx) files in
the containing directory and subdirectories except those excluded
using the "exclude" property. JS files (.js and .jsx) are also included
if allowJs is set to true. If the "files" or "include" properties are
specified, the compiler will instead include the union of the files
included by those two properties.

So,it doesn't use settings in your tsconfig.json when compiling your files, it uses default TS options instead.

if you like to use TypeScript service, you have to set up your tsconfig.json accordingly. Please see the answer in http://stackoverflow.com/questions/40728785/webstorm-2016-3-error-experimental-support-for-decorators-is-a-feature-that-is for possible solutions

0
Comment actions Permalink

I'm experiencing the same issue using the latest version of idea. I don't have the issue when compiling using the CLI or when using vscode. I have a very simple tsconfig.json file. The error I see in idea is "cannot resolve directory 'features'" when doing an import like `import { foo } from 'features/foo'`

{
"compilerOptions": {
"target": "es5",
"module": "commonjs",
"allowJs": true,
"strict": true,
"baseUrl": "./src/",
"typeRoots": ["./node_modules/@types"]
},
"include": [
"src/**/*"
]
}
0
Comment actions Permalink

please attach a screenshot of the error.

Do you have TypeScript service enabled in Settings | Languages & Frameworks | TypeScript?

0
Comment actions Permalink

This is the problem I see in my project as described by others.

The project run just fine, it's just IntelliJ complain about this.

1
Comment actions Permalink

Please provide your tsconfig.json

0
Comment actions Permalink

This is my tsconfig.json file.

Please note that tsconfig.json file is stored not in the root of the project but in ./app/ui directory - if that matters.

 

{
"compilerOptions": {
"alwaysStrict": true,
"noImplicitReturns": true,
"emitDecoratorMetadata": true,
"experimentalDecorators": true,
"module": "system",
"target": "es5",
"removeComments": true,
"suppressImplicitAnyIndexErrors": true,
"outDir": "generated",
"inlineSourceMap": true,
"importHelpers": true,
"baseUrl": ".",
"paths": {
"tslib": [
"../../node_modules/tslib/tslib.d.ts"
]
},
"skipLibCheck": true,
"downlevelIteration": true
},
"exclude": [
"lib"
]
}
0
Comment actions Permalink

you will see the same issue if you cd to your ./app/ui directory  and run `tsc -p .` there...

the problem is that your are using "module": "system" in your tsconfig.json

TypeScript has two strategies to resolve module names:

  • node - mimics the way how module names are resolved in NodeJS
  • classic - original strategy that doesn't take node_modules into account when walking up the folder structure looking for modules (see https://www.typescriptlang.org/docs/handbook/module-resolution.html for details).
    Strategy can be specified via moduleResolution compiler option. If this option is omitted compiler will use node when target module kind is commonjs and classic otherwise

So, in your case classic resolution is used, and modules from node_modules are not found. I'd suggest specifying resolution explicitly in your config:

"moduleResolution": "node",

does it help?

0
Comment actions Permalink

Unfortunately still seeing this issue. I have `moduleResolution: node` set as well.

It seems that Webstorm is struggling to re-index and find modules - it happens at strange times, even on modules that I haven't been rebuilding. Every time something like this crops up I have to restart my project and then the "error" goes away.

Could have something to do with the fact that these modules are symlinked in a parent node_modules folder (I use yarn workspaces). But it works fine after a restart, so I'm thinking that Webstorm just doesn't refresh itself properly and recheck those symlinked modules again.

Its been a rather common occurrence actually with Webstorm and Typescript - whenever something goes wrong with the indexing and Webstorm complains, I restart and it goes away. I must reset my IDE at least 20 times a day...

File -> Synchronize does nothing btw. I've looked around, seems restart is the only thing that works. I wish there was a "Do whatever happens during restart that makes things work again" button...

1
Comment actions Permalink

>It seems that Webstorm is struggling to re-index and find modules - it happens at strange times, even on modules that I haven't been rebuilding

TSC errors don't normally have any relation to re-indexing. What Typescript version do you use? Please check Settings (Preferences) | Languages & Frameworks | TypeScript

>Could have something to do with the fact that these modules are symlinked in a parent node_modules folder

Typescript service does indeed have issues with symlinks - see https://youtrack.jetbrains.com/issue/WEB-25420 and linked tickets. But such issues normally are not intermittent

 

>Its been a rather common occurrence actually with Webstorm and Typescript - whenever something goes wrong with the indexing and Webstorm complains, I restart and it goes away

If the errors come from WebStorm own parser, try invalidating caches (File | Invalidate caches, Invalidate and restart)

1
Comment actions Permalink

I'm using the latest version of Typescript, I try keep it up to date. So that would be 2.6.1 as of now.

Unfortunately I can't access that issue you linked.

I've tried invalidating caches, it just closed all my WebStorm windows (I usually have multiple open for all the different modules I'm working on) and restarted, and then worked - but pretty much exactly the same as what I was doing before, restarting when there was an issue. It's still running into issues with finding my symlinked modules in the index after a bit of work / re-building of those modules.

Another problem that's popping up is that for some reason it refuses to find some exported members from within my symlinked modules at all now, I just have to type them out completely (no indexed autocomplete while typing) and then it suddenly finds them and works. In this case, restarting actually doesn't help. It's a really strange error, because sometimes it will find exported members within a module no problem, and other exported members it will ignore and I will have to manually add.

1
Comment actions Permalink

Upon further investigation into my second issue there, it appears that if I change the exported members from regularly exported functions, such as:

"export function someFunction() {}"

into:

"export const someFunction = () => {}"

then it works and I get auto-complete for "someFunction" in my other module code. So there is clearly some issue with the indexing of exported functions, I've also noticed this with TypeScript enum objects.

0
Comment actions Permalink

>I'm using the latest version of Typescript, I try keep it up to date. So that would be 2.6.1 as of now.

That's the issue. Typescript service integration doesn't work with TypeScript 2.6.x due to breaking API changes. Please try using bundled TypeScript instead. Problem is addressed in upcoming 2017.3

Completion for exported functions works fine for me. If changing TypeScript version doesn't make things any better, please provide exact code snippets/files I can use to recreate the issue

0
Comment actions Permalink

when will the problem be solved?

0
Comment actions Permalink

what problem?

If you have problems, please don't add comments to old threads not related to your issue, create a new one.

0
Comment actions Permalink

Webstorm doesn't find the tsconfig.json, which is in the rootdir

0
Comment actions Permalink

the message indicates that the file being compiled is not included in tsconfig.json.

See https://intellij-support.jetbrains.com/hc/en-us/community/posts/205979284/comments/204851490 above

0
Comment actions Permalink

It seems this issue was never solved.  I read the all comments and it just goes on circles.  I have a similar issue.  Using IntelliJ idea ultimate.  I have added my d.ts file using :

  "files": [
"typings/Core.d.ts"
]

However, for some reason Intellij does not pickup the type definitions from here. 

TS7016: Could not find a declaration file for module 'luciad/view/Map'. 'C:/Luciad/LuciadRIA_2018.0.03/web/luciad/view/Map.js' implicitly has an 'any' type.

The webpack runs perfectly well but IntelliJ IDE keeps reporting the TS7016 error.

 

 

 

0
Comment actions Permalink

>It seems this issue was never solved. 

Most issues in this thread are configuration problems, not bugs, and all them are resolved.

>  I have a similar issue

doesn't look similar to any issue reported in this thread... Also, using

"files": []

for adding type definitions is definitely not a recommended practice.

Please provide a sample project that can be used to recreate the issue

 

0
Comment actions Permalink

SOLUTION

I had the same issues. This is my path:

  1. editing alias paths in tsconfig.json
  2. the IDE offers me to shorten corresponding import-paths (good thing)
  3. I take the advice and use the auto-correction methods of IntelliJ
  4. import is shortened and IntelliJ answers with TS2307 error (cannot resove path...). Also the compiler for angular throws the error.
  5. re-running the compiler solves the issue for the compiler but the IDE still shows me TS2307.
  6. HERE COMES THE SOLUTION (thank you @Elena): restarting the TypeScript Service (or IntelliJ) solves the issue for me. Have a look at the next comment to see how to restart the Service.

Using the latest IntelliJ 2019.1.1

0
Comment actions Permalink

>re-running the compiler solves the issue for the compiler but the IDE still shows me TS2307.

 

did you try re-starting the Typescript service using Restart TypeScript service button?

1
Comment actions Permalink

@Elena: Thank you, that solves the problem for me, too! I updated the comment.

0
Comment actions Permalink

Restarting the typescript service sort of worked for me.  I clicked Restart TypeScript Service.  That killed it, but it wouldn't restart by itself.  I had to close and reopen WebStorm, then it started back up.

0
Comment actions Permalink

Caches.. Never forget to clear your caches and restart. 

@Elena, brilliant! 

 

0

Please sign in to leave a comment.