How can I use external library like moment.js in my angular package?

[jcimoch]

Type of Issue

• Bug Report
• Feature Request

Description

Let's say I want to use momen.js library. When I do

import * as moment from 'moment';

ng-packgr will inline whole library to the bundle. How should I use it to act as peerDependecy so it would use packge installed in module where my library would be consumed?

By the way, despite the moment.js is inlined it seems it is not working when library is consumed by the target application :(

I use same configuration as in https://github.com/dherges/ng-packaged

[dherges]

Hi @jcimoch,

please check #129.

If there is a concrete issue and something is not working, please give a precise description of what is not working.

[dherges]

moment.js registers on the global scope with moment, see moment.js#L10.

Import of moment.js in TypeScript import ... from 'moment';

According to #135, lib.externals configuration should be:

{
  "lib": {
     "externals": {
        "moment": "moment"
     }
   }
}

You can then use it with:

import * as moment from 'moment';

[JoostK]

If you want to use moment both with Rollup (bundling using ng-packagr) and Webpack (if you use the library's sources directly with Angualar CLI for example) you may find that the import * as moment from 'moment' import is not compatible with Angular CLI's stack. For a compatible syntax for both bundlers, use the following:

import * as momentNs from 'moment';

const moment = momentNs;

[kum-deepak]

Suggestion from @JoostK worked for me when I was trying to use moment-timezone. No other approaches listed in this page worked for me (there are no es6 version for moment-timezone):

import * as momentNs from 'moment-timezone';

const moment = momentNs;

[aryanisml]

Currently using angular 6 library project and try to incorporate the moment.js in library project.
Getting the same error - Cannot call a namespace ('moment')

Try the same solution which mention in above,

Added moment in ng-package.json file

"lib": {
"entryFile": "src/public_api.ts",
"externals": {
"moment": "moment"
}
}

However still getting the same error.

[JanneHarju]

This externals didn't do much for me but using moment-es6 does. #290 (comment)

[watofundefined]

Adding "allowSyntheticDefaultImports": true to tsconfig.json helped me with lodash.
Now imports like import _ from "lodash" are ok.

https://www.typescriptlang.org/docs/handbook/compiler-options.html

[github-actions]

This issue has been automatically locked due to inactivity. Please file a new issue if you are encountering a similar or related problem.
_{This action has been performed automatically by a bot.}