Error while using moment

[sushant23]

I am getting the following error while trying to use this library in my project

Uncaught (in promise) TypeError: Cannot read property 'split' of undefined
at Object.eval (moment-timezone.js:34)
at eval (moment-timezone.js:12)
at eval (moment-timezone.js:18)
at Object../node_modules/moment-timezone/moment-timezone.js (reactBoilerplateDeps.dll.js:4931)
at webpack_require (reactBoilerplateDeps.dll.js:21)
at eval (index.js:1)
at Object../node_modules/moment-timezone/index.js (reactBoilerplateDeps.dll.js:4924)
at webpack_require (reactBoilerplateDeps.dll.js:21)
at eval (eval at 42 (36.chunk.js:83), :1:42)
at Object.42 (36.chunk.js:83)

[SamMatthewsIsACommonName]

Hi I was having the same issue make sure you are using at least moment 2.6.0 as in the docs

[sushant23]

I am currently using latest version i.e. 2.17.1 and I am still getting the same error

[BipinBhandari]

This issue seems to be fixed by settings moment=moment.default in moment-timezone.js line 20

}(this, function (moment) {
	"use strict";
	moment=moment.default;

Might be issue with import. Can anyone fix?

[peterjcaulfield]

I'm also experiencing this issue using es6 imports.

dep versions:

"moment": "2.17.1",
"moment-timezone": "^0.5.11",

code:

import moment from 'moment';
import 'moment-timezone';
moment.tz.setDefault('Europe/London');

Produces:

Uncaught TypeError: Cannot read property 'split' of undefined
    at Object.eval (webpack:///./~/moment-timezone/moment-timezone.js?:37)

Not 💯 on whether or not I am importing moment-timezone correctly but I couldn't find any documentation on how to handle this.

[lmammino]

Same issue here, I hope this get addressed any time soon 😞

[butterflyhug]

I'm a little confused about what is happening here. It looks like y'all are having trouble using ES6 import syntax with webpack. What I don't understand is how you're importing moment as an ES6 module in the first place -- there's absolutely nothing in our packaging that would allow you to import moment using ES6 syntax and get anything other than the normal browser global. Something is rewriting our packaging in order to achieve this result -- presumably webpack, but I've never used it so I don't really know how it works.

I'm inherently skeptical about adding code to moment-timezone to support a module system that moment and moment-timezone do not support. Many webpack users are experiencing pain with Moment's locales now, which is fundamentally rooted in the fact that we built our UMD packaging under the assumption that everyone using CommonJS is using Node (which was generally true at the time). So this time around, I really don't want to assume that everyone using ES6 is using webpack or other current-generation tools. In other words, I'd like to be convinced that this solution will always be the right thing to do to support ES6 modules, even in a future where another packaging tool decides to translate our UMD setup differently, or even in a future where Moment supports ES6 modules natively.

Could someone please explain in more detail what webpack is doing here, and why #476 would be a reasonable solution to include in moment-timezone?

[maggiepint]

For what it's worth, I'm starting a webpack project right now (like, on day 1 here). I'll pull in moment since I tend to always do so anyways and see what I can make of it.

[brinley]

Essentially the issue we have is at present is if we do something like

import moment from 'moment'
import 'moment-timezone'

or
import moment from 'moment-timezone'

We get the exception trying to split moment.version which is undefined

Importing moment works fine but without the timezone functionality such as

import moment from 'moment'

I trust that the best way is to properly support ES6 modules but #476 is very non-disruptive PR as moment.version would error if its undefined.

[butterflyhug]

Sorry, I guess I was unclear. I understood that moment-timezone is getting a wrapped copy of moment in your environment, and that you want it to be unwrapped so that the plugin works correctly. What I don't understand is why moment is getting wrapped in your environment, nor do I know if there is good reason to expect this wrapping behavior to be consistent with other environments (including future tools) that implement the same goals. Without that information, I don't personally feel confident that #476 will continue to be non-disruptive as the Javascript ecosystem continues to evolve over time.

Put another way, I'm not sure whether this would be properly fixed in moment-timezone or in webpack. Absent other information, I think it sounds suspiciously like webpack might be breaking moment's perfectly-valid AMD modules in the process of translating them to ES6 modules. If that is actually what is happening, then I would prefer to have webpack fix this instead of moment. But if that's not what is going on, or if we should expect the same behavior if/when we decide to natively support ES6 modules ourselves, then we should carefully vet and move forward with a solution in moment. (And then we should share that solution with other projects that also use UMD, since they will presumably face similar issues.)

tl;dr -- Yes, I want to get your build working -- but I want to make sure we do that in a way that avoids similar issues in the future, in moment and ideally also in other libraries that use the same packaging structure. I hope we'll take the time required to sort out exactly what is going on, in order to accomplish that larger goal.

[NathanBWaters]

Seeing this problem as well.

Using the following:
"moment": "2.6.0",
"moment-timezone": "0.5.13",

[soundstripe]

It looks like this is happening because of a breaking change made in the babel6 transpiler (almost always required in webpack).

Here's the issue on babel's GitHub.

Here's a related Stack Overflow link.

Here is a babel plugin that may help.

[msonowal]

same here Please if anyone have workaround please post

[gsdnano]

The link above to https://github.com/59naga/babel-plugin-add-module-exports plus the following worked for me.

import moment from 'moment';
import 'moment-timezone';

[carldunham]

Same. in fact, this works for me as well:

import moment from 'moment-timezone';

[rushglen]

If using in browser you have to use the moment.js file as well.... The moments homepage where you can download moment-timezone.js and moment-timezone-with-data.js does not make it clear you also need moment.js............

`<script type="text/javascript" src="../js/moment.min.js"></script>


<script type="text/javascript" src="../js/moment-timezone-with-data.min.js"></script>

`<script>
var a = moment.tz("2013-11-18 11:55", "America/Toronto");

console.log(a.format());
</script>`

moment.js is available here: https://cdnjs.com/libraries/moment.js

Info found here: https://momentjs.com/docs/

[pedro-teixeira]

This hack still doesn't work for me, any other suggestion?

[henrycity]

This doesn't work for me either? Anyone figures it out yet?

[henrycity]

#476 this one seems to work like @BipinBhandari suggested.

[opavader]

As a temporary workaround, I have create an updated fork patched with #476. You can use it for now with

yarn add 'https://github.com/archsaber/moment-timezone.git#develop'

[TakanashiOuken]

Same issue 2.19.0
Seems like can not get version with moment.version
But moment.default.version can work

[SargoDarya]

Latest version also seems to break for us using Webpack. Everything was fine earlier.

[Etrimus]

I have same problem, in my case it resolve by using moment 2.18.1, not 2.19.

[dharmesh03]

@Etrimus have you fix by using moment 2.18.1?

[Etrimus]

@dharmesh03 Yes, I fixed it just now in my project (Angular 4, Webpack). In My case moment is a dependency of other npm-package, but I finded version of moment by using command npm ls, and I saw 2.19.0. So, I just set concrete version in My package.json "moment": "2.18.1" and It work.

[danjohnson95]

Was this breaking change released today? Was working fine last night, redeployed today and got this error. Spent hours debugging it

[suside]

Nothing of the above works for parcel + typescript.
Workaround for me is to replace moment entirely with luxon

[thidasapankaja]

@pjmartins Without jsnext:main webpack doesn't load es6 code which means treeshaking won't work. That's definitely not good solution.

I dig deeper into this issue and here is minimal reproduction of the bug https://github.com/petrhanak/moment-timezone-jsnextmain-bug.

Is there anyway I can get this fixed and use on a react-boilerplate project?

[thidasapankaja]

Nothing of the above works for parcel + typescript.
Workaround for me is to replace moment entirely with luxon

Is there a way I can get timezone list with luxon ?

[bencooper222]

Nope, the purpose of Luxon is that it only supports browsers that have the timezone list. You can polyfill that if you'd like.

[totymedli]

For me the issue was caused by moment being mocked in the wrong way in a test.

[soullivaneuh]

This is definitely a bad export compatibility that can be fixed with ease.

I find a workaround doing simply this:

echo 'export default moment;' >> node_modules/moment-timezone/index.js;

Is it enough? 🤔

[abrbhat]

react-boilerplate/react-boilerplate#1569 (comment) This solution worked for me for react-boilerplate.

[JordanDalton]

I'm having this issue as well.

[olicooper]

In Angular 9, adding this to tsconfig.json fixed the issue for me:

{
  "compilerOptions": {
    "paths": {
      "moment": ["node_modules/moment/min/moment.min.js"]
    }
  }
}

Then import moment-timezone (my package.json just has moment-timezone@^0.5.28):

import * as moment from 'moment-timezone';

There is a console warning which isn't ideal (see this) but I haven't seen any side-effects yet.

./node_modules/moment/min/moment.min.js 1:14401-14432
Critical dependency: the request of a dependency is an expression

[cyptus]

still an issue.
only got it working with using

"moment": "2.18.1",
"moment-timezone": "0.5.13",

(Remove package-lock and node_modules to be sure)

[Hyperblaster]

still in issue.
only got it working with using

"moment": "2.18.1",
"moment-timezone": "0.5.13",

Legit, this fixed it right away for me. Thanks for saving me hours!

[iliasokolovski192]

What worked for me was a combination of solutions from answers above.

Add these in package.json

"moment": "^2.18.1",
"moment-timezone": "~0.5.13"

And in my yarn resolutions

"resolutions": {
 "moment-timezone/moment": "2.18.1"
}

remove node_modules and yarn.lock and re-install. Worked like a charm

This fixed my issue, working with Yarn, seems that adding "resolutions" is necessary.

[acanewby]

After about a billion Google searches, trying to solve this, I stumbled on the following. Like many others on this thread, I tried all of the above and nothing resolved the problem.

To summarize:

Here's what I tried first - but made no difference

(Still had Moment Timezone requires Moment.js error in browser.)

package.json (NOTE: no moment):

"moment-timezone": "^0.5.28",

*.component.ts

import * as _moment from 'moment-timezone';
// Note: no import from moment
...
myMoment(d: Date) {
        _moment.locale('en-GB');
        return _moment.tz(d, 'Europe/London').format('dddd, D MMMM YYYY, HH:mm zz');
    }

ts.config.json

{
  "compilerOptions": {
    "paths": {
      "moment": ["node_modules/moment/min/moment.min.js"]
    }
  }
}

Here's what fixed it:

I noticed that my tsconfig.json was still trying to compile for es2015. When I changed it to the following, all of a sudden my project came back to life:

"target": "es2018",

Curiously, when I set it back to es2015 to try and reproduce the original error, it was gone! I'm guessing I inadvertently forced a complete recompile and that allowed the earlier fixes to become truly effective.

If somebody who knows more about Angular/Typescript than me can figure out the effect of what I did and explain it properly to others, that would be great.

[lregaladohdez]

Same issue here.
In my case after upgrading my project from vue@2.6.10 to 2.6.11

Changing require('moment') by require('moment').default in moment-timezone.js works
but doesn't fells right

[nhhockeyplayer]

ionic angular taken down also

not fun

[cyptus]

there is an open PR since 3 years now (#476) - i dont think maintainers will fix this any time soon

[nhhockeyplayer]

this is moment
const hour = moment.tz(new Date(), 'America/New_York').hour()

this is luxon
const hour = DateTime.local().setZone('America/New_York').hour

npm i luxon

this is how i got around it

moment sounds like it was designed terribly and on its way out
i think the moment folks wrote luxon not sure

[nl-brett-stime]

@butterflyhug Moment gets wrapped in a property called 'default' because that's how the default exports from ES6 modules are designed to achieve backwards-compatible interop when using the commonjs module system as an output target:

https://stackoverflow.com/a/40295288/93345

[maddy619]

Hi,
I am also started experiencing this error after setting up cypress code coverage using this https://github.com/bahmutov/cypress-angular-coverage-example/tree/master/cypress

don`t know who to blame, the timezone or cypress guys, currently I am using Angular 6.x, typescript 2.9.x, cypress and its related libs as mentioned in the repo above.
@bahmutov

[netgfx]

Downgrading and locking dependency versions fixed it for me:

"moment": "2.23.0",
"moment-timezone": "0.5.23",

[maddy619]

Downgrading and locking dependency versions fixed it for me:

"moment": "2.23.0",
"moment-timezone": "0.5.23",

Thanks, it seems they have release buggy 2.25 today some hours before, reverted to 2.24.0 and 0.5.21 , its working

[developeruz]

After debugging this for several hours, I've installed "moment": "^2.25.3" and everything works now!

[k3n]

I still have problems with 2.25.3, but 2.24.0 works fine.

[soullivaneuh]

Works fine for me after an update:

moment: 2.29.1
moment-timezone: 0.5.32

Imported like that:

import * as moment from 'moment-timezone';

Gives you the possibility to use the timezone as well:

const date = moment.tz(ride.date, 'UTC').tz('Europe/Paris');

I am not pretty sure this is the way to go, but it works.

[ndukachukz]

I'm having this error with moment while importing the react-moment library.
Uncaught TypeError: can't access property "format", e.duration is undefined

[gilmoreorless]

Looks like this issue was fixed by #476, released in Moment Timezone 0.5.29.

I've also added some ES6 examples to the Node.js section of the docs.