moment: Webpack Error: Cannot find module "./locale" after updating to 2.19.0

@patricksteenks : yes. Fix like this in you package.json "moment": "2.18.1"

For me, broken: “moment”: “^2.24.0” (resolving to 2.25.0) Not broken: “moment”: “2.24.0”

solved via webpack aliasing:

  resolve: {
    alias: {
      'moment$': 'moment/moment',
    },
  },

Same issue on Angular-CLI built project

if you use yarn, add resolutions block to override versions of sub-dependency:

  "resolutions": {
    "moment": "2.24.0"
  }

2.19.1 is out, give it a try

Repent, repent, doomsday is here!

Worked for us with

  "resolutions": {
    "moment": "2.24.0"
  },  

and

 "moment": "2.24.0",
  "moment-timezone": "0.5.28",

using yarn

It did not work without the resolutions block.

I am using 2.22.2 and seeing the same issue.

I ended up getting past this by changing:

import * as moment from 'moment';

to:

import * as moment from 'moment/moment';

VueJS 2 Webpack builds impacted too. Temp fix is as GautierT suggested (downgrade momentjs)

package.json (issue with moment-timezone dep on moment 2.19)

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

package.json (issue in general)

    "moment": "2.18.1"

Who decided that changing the export signature in a minor version is a good idea?

Note that this also breaks 3rd party libraries relying on moment

Same here - I fixed it with a feature of yarn to overload the default settings of a package:

place this in your main package.json (adapt “moment-timezone” to the name of the package which does load moment if you do not directly load moment):

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

i can confirm. package.json

"moment": "2.18.1"

@renedx just this line enough

@darkalor @kud - Regressions happen. Please try to be constructive; everyone is aware that this shouldn’t have happened and ranting doesn’t help anyone.

Is this still advised: import moment from "moment/min/moment-with-locales"; ?

b/c I end up with same (?) error with moment@2.24.0 and CRA:

./node_modules/moment/min/moment-with-locales.js
Module not found: Can't resolve './locale' in '/...myproject/node_modules/moment/min'

+1

It’s not acceptable for a minor upgrade.

I understand the idea behind but please, be more strict about semver.

The latest patch 2.25.3 seems to have fixed it, update the momentjs version to: "moment": "^2.25.3" in package.json Remove the node_modules folder, and run yarn install or npm install should do it.

Hello Guys! I faced the same issue from last few hours and finally I have resolved it through changing moment version.

In the above comments i saw the final solution.

Reason: moment release the new version 17 hours ago from 2.24.0 to 2.25.0

Solution: Step 1: change the versions

• “moment”: “2.24.0”,
• “moment-timezone”: “^0.5.28”,

Step 2: If you are using yarn please add resolutions in your package.json file like this “dependencies” { “moment”: “2.24.0”, “moment-timezone”: “^0.5.28” }, “resolutions”: { “moment”: “2.24.0” },

Thank You.

Okay, here’s where we’re at:

• If you set your dependency to 2.18.1, everything will be fine.
• This is an issue with https://github.com/moment/moment/pull/4213
• I have engaged both the webpack and react native teams to talk about what fix will work for all parties
• Because setting the dependency to 2.18.1 provides an easy mitigation, I do not at this time want to roll back. Instead, I would like to wait on feedback from Webpack and React Native to see if we can come to an agreement about what to do that will move this situation forward. For that reason, I don’t have an ETA on a fix.
• A MCVE can be found here: https://github.com/mj1856/moment-webpack-test

Confirmed.

@hasanmehmood In my case it was enough to make a downgrade of the moment dependencies this way in CMD:

npm install moment@2.24.0

Hope this works for you too.

Same here, with 2.24.0 for my Preact project.

I think we have a fix: https://github.com/moment/moment/pull/4232

Best part - I think this will work for both webpack and react native - no sadness! I’ve tested in webpack, but would someone using react native test? Note that you will need to run grunt release to get the files built before you can test using an npm linkage.

Others might have my same problem: Even though I didn’t update to 2.19.0, in my package.json I had ^2.18.1. I changed it to 2.18.1 without the ^, and now it will not install anything higher than 2.18.1 until we know 2.19.x is safe

I´m pretty desperate… I´m using moment 2.25.1 and changing the “devDependencies”: {…},“resolutions”: { “moment”: “2.25.1” } as above… not working

Thanks, @jolalla, I first tried downgrading the version but it didn’t work for me. Finally adding the resolutions block showed some magic 😃

For others who are are facing a similar issue with their react app. They can do the following 2 steps to resolve it.

In dependencies, replace "moment": "^2.24.0", with "moment": "2.24.0",

And add the resolutions block in package.json

"resolutions": {
    "moment": "2.24.0"
  }

I have this same issue with moment version 2.24.0 in my React application. I guess this issue hasn’t been resolved yet.

Good time to switch to luxon which is what I did for one project that had a low usage of moment.

Why is this issue closed!?!??!?

@mtogstad solution works!

I don’t understand how this error could randomly show up and wreck my react app

To make it work I just included the locale file before moment. import 'moment/locale/de'; import moment from 'moment'; and later did moment.locale("de");

Same here.

import moment from "moment"
import "moment/locale/fr"
moment.locale("fr")

WARNING in ./node_modules/moment/src/lib/locale/locales.js
Module not found: Error: Can't resolve './locale' in '/Users/kud/Projects/_contexte/lois-webapp/node_modules/moment/src/lib/locale'
 @ ./node_modules/moment/src/lib/locale/locales.js 65:16-60
 @ ./node_modules/moment/src/lib/locale/locale.js
 @ ./node_modules/moment/src/moment.js
 @ ./src/index.js

Same in an Angular 4 application. Just downgraded to 2.18.1 (strict version number in package.json)

Thanks, @jolalla, I first tried downgrading the version but it didn’t work for me. Finally adding the resolutions block showed some magic 😃

For others who are are facing a similar issue with their react app. They can do the following 2 steps to resolve it.

In dependencies, replace “moment”: “^2.24.0”, with “moment”: “2.24.0”,

And add the resolutions block in package.json

“resolutions”: { “moment”: “2.24.0” }

Works for me too! Thank you!! 😄！thinks！

If by chance anyone else has a monorepo (and/or are using workspaces in package.json), the ‘resolutions’ fix to use the previous moment release 2.24.0 will only work if applied in the root level package.json. In our case, we had to do the following: { “resolutions”: { “**/moment”: “2.24.0” } }.

Truly hope moment release 2.25 is fixed properly ASAP!

Anything else I can try? "moment": "2.24.0", and "resolutions": { "moment": "2.24.0" } aren’t fixing it for me. This is for a Heroku deployment. Any ideas are appreciated.

@darkalor it wasn’t intentional - the export signature in question is only materially different in a limited set of circumstances - the sort of thing that seems to work just fine until it gets exposed to a large number of users.

@TomMettam 2.19.0 pointed webpack at the es6 code in moment/src/moment,which doesn’t export quite the same interface as moment/moment.

On top of that, the aliased require prevents webpack from packaging all files that could possibly be requested dynamically. Importing the locale files manually would work, except that the obvious choice of importing from moment/locale will load them into a different instance of moment to the one you are actually using.

And if that is all too simple, there are differences in the behavior of different versions of yarn/npm - I happen to be using a version of npm that uses whatever instance of the package is in the root app node_modules folder, but other versions make it harder to override the packag used.

npm install moment@2.18.1 as a temporary fix so you don’t have to deal with updating package.json multiple times. This will probably get fixed soon, then you can do npm i.

I added a metro.config.js file after upgrading, which didn’t allow the files to be loaded correctly. Removed the file and it works again.

moment version is 2.24.0 in a package.json instead of ^2.24.0 that since I installed it.

I followed this process, one of the above measures

1. add resolutions block
2. remove node_modules directory and reinstall package from yarn.

works for me, but don’t know why working…😂

Thank you for your interest : ) @agrohs

Thanks, @jolalla, I first tried downgrading the version but it didn’t work for me. Finally adding the resolutions block showed some magic 😃

For others who are are facing a similar issue with their react app. They can do the following 2 steps to resolve it.

In dependencies, replace "moment": "^2.24.0", with "moment": "2.24.0",

And add the resolutions block in package.json

"resolutions": {
    "moment": "2.24.0"
  }

Works for me too! Thank you!! 😄

For me, broken: “moment”: “^2.24.0” (resolving to 2.25.0) Not broken: “moment”: “2.24.0”

Thank you man, I’m struggling with this all day long

@mj1856 is it appropriate to re-open this issue or should we create a fresh/new one? I’m also seeing this again. Rolling back to 2.22.1 did not fix it in my case and I had to use @patsissons fix to make webpack happy again.

seems to still exists in “version”: “2.22.2”?

@ichernev : 2.19.1 is working for me. React 16. create-react-app. Not ejected

Moment loaded like this :

import moment from 'moment'
import 'moment/locale/fr'

Thanks for the fix. 👍

I’m using yarn as my package manager. For some reason, my yarn.lock file wasn’t updating to reflect the change I made in my package.json file. my settings to as @daniesy said. The issue was moment-timezone in my yarn.lock file was still depending on the moment version ‘^2.18.1’.

To fix it, I ran a yarn cache clean: yarn cache clean

Then : yarn install

Hopefully, this should re-generate your yarn.lock file with something along the line of:

moment-timezone@0.5.13:
  version "0.5.13"
  resolved "https://registry.yarnpkg.com/moment-timezone/-/moment-timezone-0.5.13.tgz#99ce5c7d827262eb0f1f702044177f60745d7b90"
  dependencies:
    moment ">= 2.9.0"

moment@2.18.1, moment@2.x, "moment@>= 2.9.0", moment@^2.17.1:
  version "2.18.1"
  resolved "https://registry.yarnpkg.com/moment/-/moment-2.18.1.tgz#c36193dd3ce1c2eed2adb7c802dbbc77a81b1c0f" 

Either way, just, check ur yarn lock isn’t trying to include a moment version greater than 2.18.1 in any module especially moment-timezone and moment.

@TomMettam Yes it happens but when it happens you can deal with it and by dealing I mean you could upgrade it as major, not minor. That’s all. I don’t blame anyone, I blame the situation that if someone thinks “oh ok I can upgrade, as it’s just a minor”, it’s rather wrong in this case. 😉

I appreciate all the work done on moment, but I only talk about the unstable situation.

I don’t offend anyone, sorry.

We wait fix 2.19.1…

Can somebody figure out all the bits from 2.19 that broke webpack, propose a minimal PR (based on 2.19.0), that reverts the “bad” pieces, and we’ll consider merging it for 2.19.1.

Saying “me too” for the 1000 time is not brining much to the table.

@ggsjyoon there might be an additional requirement from one of your packages (e.g. moment-timezone) - you can use my tip https://github.com/moment/moment/issues/4216#issuecomment-335489518 to fix this with yarn

@ggsjyoon: I had a similar situation (still getting the error) until I remembered you’ll need to update one of the files that WebPack is watching to have it regenerate and do away with any cached version.

@ichernev seems very likely that the rename of ‘require’ is causing these widespread breakages. I suspect that when you require modules using a reference like that it means that webpack is unable to detect the import since it uses AST static analysis to determine dependencies.

Perhaps you could provide some details of the React Native issue it was fixing as there might be some better way around that original issue?

MCVE: https://github.com/mj1856/moment-webpack-test

Strictly speaking, I think the Angular connection is simply because most Angular projects use Angular-CLI, which internally uses Webpack. But it may be related to some specific Webpack configuration in that stack. It does seem to be a fairly general bundling problem, though.

I can confirm this is also happening!

With 2.29.1 dynamic import of locales still does not work with webpack and the create-react-app config (worked with 2.24).

A workaround is to add a new Javascript file in your project that just imports the one locale and then dynamically import that file.

For those who’ve lost some confidence in moment, and don’t want their apps to completely break from this issue happening again in the future - I switched a medium-sized codebase over to luxon without too much trouble.

@m4mariaoni - that’s because u installed without --save-dev, so you’re changing the right part.

If you’re still encountering this issue after locking moment to 2.24.0, nuke the moment folder from node_modules and reinstall your packages with npm install --save

Been doing this for hours on my angular 8 app with npm.

1. I updated from moment 2.17 to 2.24
2. I added the resolutions as adviced above - "devDependencies": {...},"resolutions": { "moment": "2.24.0" } to package.json
3. Changed to yarn by doing the following. rm -rf node_modules package-lock.json && yarn Thanks a lot guys

@hasanmehmood it worked for me, thank you man

The above fix doesn’t work for me. Node v12.6.0, yarn v1.22.4, react-scripts-ts

same

Also noticed a regression in v2.22.2. Rolling back to 2.22.1 fixed it for me.

i cant get 2.18.1 to work for me either

works with typescript/webpack/karma/phantomjs. Thanks for the fix!

I too can confirm this issue is resolved for Angular-CLI v1.4.4. Thank you!

For some reason, yarn ignored my “resolutions” setting from package.json. A hacky way to fix it, if you’re using moment-timezone is to edit the yarn.lock

moment@2.18.1:
  version "2.18.1"
  resolved "https://registry.yarnpkg.com/moment/-/moment-2.18.1.tgz#c36193dd3ce1c2eed2adb7c802dbbc77a81b1c0f"

"moment@>= 2.9.0":
  version "2.18.1"
  resolved "https://registry.yarnpkg.com/moment/-/moment-2.18.1.tgz#c36193dd3ce1c2eed2adb7c802dbbc77a81b1c0f"

Hey @kud, @AleshaOleg – if you are still trying to import locales: instead of: import 'moment/locale/* try: import 'moment/src/locale/*'

Have been fighting with the same issue over here… ––– @AleshaOleg : in your use case i think it could be: import moment from 'moment' import 'moment/src/locale/uk' and then just call moment(date).format('ddd')

@maggiepint Seeing what worked for @morrisonbrett, I’m thinking that #4213 may not be the problem. 2.19 introduced another new change, the module field in package.json - ie previously webpack was using the transpiled version.

Turning on ES6 for react native is what caused most of the issues blocking #4187, and #3904 (on the develop branch only for quite a while) made the same change for all webpack users.

In our project we’re using yarn 1.0.2, create-react-app, and these deps in package.json

"dependencies": {
    "@types/history": "^4.5.0",
    "@types/jest": "^20.0.6",
    "@types/material-ui": "^0.18.2",
    "@types/moment-timezone": "^0.5.0",
    "@types/node": "^8.0.20",
    "@types/react": "^16.0.10",
    "@types/react-big-calendar": "^0.14.0",
    "@types/react-dnd": "^2.0.33",
    "@types/react-dnd-html5-backend": "^2.1.8",
    "@types/react-dom": "^16.0.1",
    "@types/react-modal": "^1.6.6",
    "@types/react-redux": "^4.4.40",
    "@types/react-router-dom": "^4.0.4",
    "@types/react-router-redux": "^5.0.0",
    "@types/redux": "^3.6.0",
    "@types/redux-logger": "^3.0.0",
    "@types/redux-promise-middleware": "^0.0.6",
    "@types/validator": "6.3.0",
    "lodash": "^4.17.4",
    "material-ui": "0.19.2",
    "material-ui-datatables": "^0.18.2",
    "material-ui-fullscreen-dialog": "0.7.1",
    "moment": "2.18.1",
    "moment-timezone": "^0.5.13",
    "react": "^15.6.1",
    "react-barcode": "^1.2.0",
    "react-big-calendar": "^0.15.0",
    "react-bootstrap": "^0.31.0",
    "react-bootstrap-table": "^3.4.2",
    "react-bootstrap-time-picker": "^1.0.3",
    "react-dnd": "^2.4.0",
    "react-dnd-html5-backend": "^2.4.1",
    "react-dock": "^0.2.4",
    "react-dom": "^15.5.4",
    "react-modal": "^1.7.7",
    "react-pdf-js": "^2.0.5",
    "react-phone-number-input": "^0.12.10",
    "react-print": "^1.3.1",
    "react-redux": "5.0.6",
    "react-router-dom": "^4.1.1",
    "react-router-redux": "next",
    "react-tap-event-plugin": "^2.0.1",
    "react-transition-group": "^1.1.1",
    "redux": "3.7.2",
    "redux-logger": "^3.0.1",
    "redux-persist": "^4.8.0",
    "redux-promise-middleware": "4.2.1",
    "reselect": "^3.0.1",
    "validator": "8.2.0",
    "zxcvbn": "^4.4.2"
 }

Although we’re using "moment": "2.18.1", we’re still getting

Is there a workaround of the issue for yarn?

Can confirm:

This relative module was not found:

* ./locale in ./node_modules/moment/src/lib/locale/locales.js