Typescript, index.d.ts and webpack: Module not found error

Question

I created Typescript project with webpack, following this tutorial. As I have a lot of modules, I added index.d.ts to my src/components folder where I export all my modules:

export {Module1} from "./Module1";
export {Module2} from "./Module2";
export {Module3} from "./Module3";

I added index.d.ts to tsconfig.json files:

"files": [
    "./src/components/index.d.ts"
]

Then, in index.tsx, which is in src folder, I import:

import * as MyModule from "./components/";

Code hinting works fine, so I suppose all paths are OK. However when I run webpack, I get this error:

Module not found: Error: Cannot resolve directory './components'

As I understand, webpack doesn't find this index.d.ts file. I tried adding d.ts to webpack.config.js extensions, like described here, but then I've got a different error message. Am I missing something?

Answer 1

Came up with a solution to use index.ts for all exports instead of index.d.ts.

Answer 2

For me, I ended up changing it from './types' to './types.d'.

So a type import would look something like,

import {
    TSomeType,
    ISomeInterface,
    ESomeEnum
} from 'src/types/components/SomeComponent/types.d'

instead of,

import {
    TSomeType,
    ISomeInterface,
    ESomeEnum
} from 'src/types/components/SomeComponent/types'

Taken from this comment:

I can confirm this issue, @Draccoz @filipesilva .

It does not happen when you change the filename from .d.ts to .ts. It also does not happen when you change your import from import { Something } from 'yourlib'; to import { Something } from 'yourlib.d';

I just moved a working project from a webpack-starter seed (TypeScript/Angular) to CLI and got this error, so I assume it has something to do with the generated CLI project.

I'm using @angular/cli: 1.0.0-rc.2

---

I think that it's also worth to note that tsx files work just fine. I had to change types to types.d only for ts files.