0

I would like to make a generic module that has a bunch of utility methods, including moment and lodash functionality. I've imported lodash and typed it and I can access it from my components as long as I include the code:

import * as _ from "lodash";

However, I'd like to make this more generic so I can just import my Utils module and have both lodash and moment (as well as a few custom functions) available without having to import these individually in every component.

I've got the following code:

import { Injectable, NgModule } from "@angular/core";
import * as _ from "lodash";
import * as _ from "moment";

@Injectable()
@NgModule({
    exports: [_, moment]
})
export class Utils { }
}

I get the following error:

Build:Argument of type '{ exports: LoDashStatic[] 1>; }' 
   is not assignable to parameter of type 'NgModule'

Edit: What I'd like to do is this:

import { _, moment } from "./Utils.module";

instead of

import * as _ from "lodash";
import * as moment from "moment";

How can I accomplish this?

Edit: Made the code reflect more of what I'd like to accomplish...

7
  • how can you use both decorators? @Injectable and @NgModule ? Also, lodash is a library and it is not a module Commented Apr 29, 2017 at 20:39
  • @Aravind I don't know... is that bad? It seemed to be working without the lodash stuff. Commented Apr 29, 2017 at 20:41
  • ok. tell me what is that you are trying to achieve I will help you out Commented Apr 29, 2017 at 20:41
  • In my component, I would like to be able to do import { _, moment } from "../../app.common/utils.service"; and use lodash and moment from a single module instead of importing each one. I thought my code above would do this, but I get an error. Commented Apr 29, 2017 at 20:47
  • you can import lodash and service from the respective files. But you cannot use the above code. as every decorator in angular expects a class for it. Commented Apr 29, 2017 at 20:51

1 Answer 1

2

This

@NgModule({
    exports: [_, moment]
})
...

won't work (and thanks to TypeScript, it can detect the issue with type checking), because exports contains for Angular modules, while these are ES6 modules:

import { _, moment } from "./Utils.module";

Instead, it may be not .module.ts file, which are conventionally used for Angular modules, but utils.ts:

import * as _ from "lodash";
import * as moment from "moment";
export { _, moment };

And usually the one should never want to have a separate 'util' file to import third-party packages from it like import { _, moment } from "./utils". The path is relative and needs to be maintained in each file where it is imported. The paths to the packages are not, that's their major advantage.

The whole thing looks like modular antipattern. You won't see this in well-designed projects, because it makes little sense. I would personally recommend to not do this, unless you are really sure what are your benefits here.

Sign up to request clarification or add additional context in comments.

Comments

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.