Support for directory named module

When creating an application that follows atomic design, you usually want to create 1 folder per module, this folder containing both the tsx file and the scss file.

The issue is that, right now you're forced to either name your tsx files "index.tsx", so that you can import them using 'import "/path/to/DirectoryName"', but then it means that every single file module file in your project now have the same "index.tsx" name, which is a pain.

The other solution is to name your component files the same name as the folder, but now you have to specify the file name in the import. Exemple : 'import "/path/to/DirectoryName/DirectoryName".
But now you have import statements that are longer than needed, and it doesn't force you to name your tsx file correctly (unless you use CI), because it's not a default name anymore.

To have the best of both wold, we'd need for the default name to be either index.tsx or DirectoryName.tsx, so that we can do 'import "/path/to/DirectoryName"' to import /path/to/DirectoryName/DirectoryName.tsx

Webpack already supports this through this plugin : https://www.npmjs.com/package/directory-named-webpack-plugin (25k weekly downloads), so you can get an application that works using this kind of imports.

But the IDE's can't resolve the directory named imports, mostly because TS doesn't support it.

Adding support to this would be greatly appreciated.

This is been an issue for quite a long time, as been documented here : https://github.com/microsoft/TypeScript/issues/24116
This linked above issue also contains a proposed solution by @tylerkayser
@gaui 's comment summarizes that well : https://github.com/microsoft/TypeScript/issues/24116#issuecomment-399724546

まず、リンク先の TypeScript issue #24116 と、参照されているコメントで提案されている解決策を読み、要求された動作を既存のモジュール解決設計と比較します。ディレクトリの import で、ファイル名を指定しなくても同名の TSX ファイルが解決され、既存の index.tsx の動作が維持されれば完了です。