Search code examples
angularwebpackwebstorm

Webstorm 11 'cannot resolve' warnings with folder imports


I just cloned the Angular 2 Webpack Starter, and tried it in WebStorm 11.

It mostly works, but WebStorm complains and underlines some module import names.

For instance, in app.component.ts, the {Home} in import {Home} from './home'; is underlined in red.

When I hover the underlined module name, it reads: Cannot resolve symbol 'Home'

webstorm error

If I replace './home' by './home/index', though, the underlining goes away.


Will I have to add '/index' to all the module names, or is there a way to tell WebStorm not to worry?


Solution

  • The best way to solve this issue is to ... upgrade to WebStorm 2016


    In the meantime, here are some temporary measures you could adopt in WebStorm 11 to spare your eyes:

    weak warning

    weak warning

    Change the severity of the error to Weak Warning.

    This will display the error in a less aggressive manner, while keeping the Validate Imports option on.

    For more info about disabling Validate imports: disable inspections in WebStorm


    disable this inspection or suppress it for current import (tweaks for WebStorm 11 provided by IntelliJ support team)

    One can " either disable this inspection or suppress it for current import:

    Alt+Enter, hit Right, then choose either Disable inspection or Suppress for statement "

    So you would still get the red warnings, but you can selectively act on the irrelevant ones (the ones coming from a folder import)

    suppress

    ----------

    RELATED INFORMATION

    On how TypeScript resolves modules:

    " An import statement like import { b } from "./moduleB" in /root/src/moduleA.ts would result in attempting the following locations for locating "./moduleB":

    • /root/src/moduleB.ts
    • /root/src/moduleB.ts
    • /root/src/moduleB.tsx
    • /root/src/moduleB.d.ts
    • /root/src/moduleB/package.json (if it specifies a "typings" property)
    • /root/src/moduleB/index.ts
    • /root/src/moduleB/index.tsx
    • /root/src/moduleB/index.d.ts "

    http://www.typescriptlang.org/docs/handbook/module-resolution.html