moment has no default member

Created on 9 Jan 2018 · 4Comments · Source: moment/moment

Description of the Issue and Steps to Reproduce:
Trying to implement instance locale in typescript project
https://momentjs.com/docs/#/i18n/instance-locale/
but when I import moment from 'moment' I get error:
moment has no default export

purpose:
I need custom forms (shorten, like 'sec' instead 'seconds') of humanized strings in some parts of application, so I would like to use two locales in one view.

Environment:
typescript project

Other information that may be helpful:
TypeScript, Angular4

If you are reporting an issue, please run the following code in the environment you are using and include the output:

console.log( (new Date()).toString())
console.log((new Date()).toLocaleString())
console.log( (new Date()).getTimezoneOffset())
console.log( navigator.userAgent)
console.log(moment.version)

Tue Jan 09 2018 15:46:46 GMT+0100 (CET)
VM12667:2 09/01/2018, 15:46:46
VM12667:3 -60
VM12667:4 Mozilla/5.0 (Macintosh; Intel Mac OS X 10_13_1) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/63.0.3239.84 Safari/537.36
VM12667:5 Uncaught ReferenceError: moment is not defined
    at <anonymous>:5:13



md5-1f8dcc13f1f8244065e29a6dcf5a9efa



import * as moment from 'moment';
console.log('version', moment.version);



md5-1f8dcc13f1f8244065e29a6dcf5a9efa



version 2.20.1

I would like to prevent the import * as moment from 'moment'; solution since it blocks three shaking in bundling

Many thanks! :)

Source

luckylooke

👍4

Most helpful comment

RTFM 😂

Note: If you have trouble importing moment, try adding 
"allowSyntheticDefaultImports": true in compilerOptions 
in your tsconfig.json file and then use the syntax

https://momentjs.com/docs/#/use-it/typescript/

luckylooke on 17 Jan 2018

👍40 🎉3 👎1

All 4 comments

RTFM 😂

Note: If you have trouble importing moment, try adding 
"allowSyntheticDefaultImports": true in compilerOptions 
in your tsconfig.json file and then use the syntax

https://momentjs.com/docs/#/use-it/typescript/

luckylooke on 17 Jan 2018

👍40 🎉3 👎1

Is there a chance that this will be resolved in a way where allowSyntheticDefaultImport is no longer required? The issue with requiring it is that it requires everyone who uses moment to also have this setting on.

By not requiring this setting, you allow moment to be easily used in projects that have their own preference for allowSyntheticDefaultImport, but now that setting is effectively forced on everyone.

evert on 16 Apr 2019

👍18

Just chiming in here that this is a really, truly, obnoxious problem. Since moment has chosen not to respect the official spec, it means that some libraries pull in via import * as moment from "moment" while other libraries run via import defaultMoment from "moment". So, when my project attempts to load both, I just cannot get the right settings to get rollup to properly compile it. I've tried nearly every permutation and combination of allowSyntheticDefaultImports : true, esModuleInterop : true, moduleResolution : "node" and skipLibCheck : true and I cannot get a permutation that works correctly. One solution will allow one library with one import format to work, but it fails in the other.

There's a reason that spec's exist, ans that's to create consistency. Is there no way that moment could have a moment-es variant or something which can be properly imported, so that way people that want to follow the spec can just follow the spec, allowing the JS toolchain to work as expected, rather than all the hacks?