Angular 2/ Typescript Re-export: "Module not found: Can't resolve [...]"

Question

I'm working with Angular 2 and Typescript. I'm trying to create a collection of classes, each defined in its own file, and want to be able to import them with a single (or perhaps) more lines.

Something similar like this:

// lib/foo.ts
export class Foo {}

// lib/bar.ts
export class Bar {}

// lib/index.d.ts
export * from './foo';
export * from './bar';

// app.component.ts
import * as lib from './lib';

...
let foo = new lib.Foo();
let bar = new lib.Bar();

I searched a while through the internet, and tried a lot of possible ways in my code, but none of them seems to work. For example, in this Stackoverflow answer, it seems to be the same syntax as mine (the code just above).

So maybe this is an angular specific issue?

Here's the full error message I receive, when building with "ng serve" (on the angular cli):

ERROR in ./src/app/api-module/services/factory.service.ts
Module not found: Error: Can't resolve '../sketch-objects' in 'D:\[...]\PhpStorm\vector-sketch\src\app\api-module\services'
 @ ./src/app/api-module/services/factory.service.ts 8:0-51

While having an import like the following works:

import {Scene} from '../sketch-objects/scene';

Just for understanding: I am programming an app which deals with threeJS, and want to create some sort of factory, which builds threeJS objects (or more precisely, a wrapper around a threeJS object) according to a specific string given in. For example I have a function

// factory.service.ts
import * as lib from './lib'

...
create(objectType: string): any {

  let threeObject = lib[objectType]();
  return threeObject;
}

I appreciate any help, Thanks.
bertiooo

As stated here: [link](https://www.typescriptlang.org/docs/handbook/modules.html#import-the-entire-module-into-a-single-variable-and-use-it-to-access-the-module-exports), one can import an entire module into a single variable and use it to access the module exports — bertiooo, Jul 15 '17 at 13:56
Ok, you pointed me in the right direction. I thought the module loader would automatically look for an index.d.ts when writing just `'./lib'`, but obviously hasn't found anything. Now I wrote `./lib/index` and that worked! Thank you! — bertiooo, Jul 15 '17 at 14:10
Yes! You were helpful. Thank you very much. Don't need more help. — bertiooo, Jul 15 '17 at 14:13

Aravind · Accepted Answer · 2017-07-15T14:05:44.217

1

You are importing single service from two places which creates two instances

See this line

import {Scene} from '../sketch-objects/scene';

Second import from the lib file
```
import * as lib from './lib'
```
So angular will not know which service instance to pick when the Sketch service is used.

To solve this, import services from the same path

Note: Also see this answer

edited Jul 15 '17 at 14:05

answered Jul 15 '17 at 14:00

Aravind

40,391
16
91
110

Angular 2/ Typescript Re-export: "Module not found: Can't resolve [...]"

1 Answers1