WebStorm无法识别导入中的index.ts文件

Question

I have a project setup which is using Webpack. I have a few aliases for different directories:

alias {
    shared/common: path.join(__dirname, 'src/main/js/publish/shared/common')
    app/common: path.join(__dirname, 'src/main/js/publish/app/common')
}

In some files I would like to import different modules from a single barrel :

import { Comp1, Comp5, Comp7 } from 'shared/common/components';

In order to make that work, inside shared/common/components I created the barrel index.ts file:

import { Comp1 } from '.comp1/comp1.comp';
import { Comp2 } from '.comp2/comp2.comp';
import { Comp3 } from '.comp3/comp3.comp';
....
import { CompN } from '.compN/compN.comp';

export {
    Comp1,
    Comp2,
    Comp3,
    ...
    CompN
}

Although this compiles fine, WebStorm displays an error in the first import saying that it cannot resolve all those symbols.

I tried to mark src/main/js/publish as Resource Root, as that's the directory which contains shared and app , but still doesn't work.

It works fine if I change the import to:

import { Comp1, Comp5, Comp7 } from 'shared/common/components/index.ts';

Is there any way to make WebStorm recognise those index.ts files without actually writing them in the imports?

Answer 1

As @anstarovoyt pointed out in his comment, the problem was fixed after updating to WS2016.2 .

So it seems that the only two options are either update your WebStorm or keep writing the extension in the imports:

import { Comp1, Comp5, Comp7 } from 'shared/common/components/index.ts';