Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

moment with locales: "./locale" not found #2979

Closed
electrobabe opened this issue Feb 22, 2016 · 48 comments
Closed

moment with locales: "./locale" not found #2979

electrobabe opened this issue Feb 22, 2016 · 48 comments

Comments

@electrobabe
Copy link

@electrobabe electrobabe commented Feb 22, 2016

I'm getting this warning when using webpack:

WARNING in ./~/moment/min/moment-with-locales.js
Module not found: Error: Cannot resolve 'file' or 'directory' ./locale in \node_modules\moment\min
@ ./~/moment/min/moment-with-locales.js 271:16-43

any clues?

@mattjohnsonpint
Copy link
Member

@mattjohnsonpint mattjohnsonpint commented Feb 24, 2016

See #1435. Workaround at the end. Thanks.

@electrobabe
Copy link
Author

@electrobabe electrobabe commented Feb 24, 2016

the suggested workaround in "plugins" of webpack.config.js

new webpack.ContextReplacementPlugin(/moment[\\\/]locale$/, /^\.\/(en|de|cz|eu)$/)

did not work

@mheimschild
Copy link

@mheimschild mheimschild commented Feb 26, 2016

The problem mentioned above is about require('./locale' + name) statement included in the file min/moment-with-locales.js. It is not necessary anymore because all locales are already included in this file itself.

Unfortunately webpack tries to resolve all require statements - therefore this warning.

@mattjohnsonpint
Copy link
Member

@mattjohnsonpint mattjohnsonpint commented Feb 27, 2016

@ichernev - I don't use webpack, but it seems like the point @mheimschild makes is reasonable. Not sure how to handle it though.

@mheimschild
Copy link

@mheimschild mheimschild commented Feb 28, 2016

The simplest solution how to convince webpack not to look for locales already included in the moment-with-locales.js is to force him to load something else instead. This worked for me:

install empty module (it literary contains nothing)
npm install --save-dev empty-module
and then configure ContextReplacementPlugin as follows
new webpack.ContextReplacementPlugin(/\.\/locale$/, 'empty-module', false, /js$/)

Hopefully this helps.

@kahboom
Copy link

@kahboom kahboom commented Sep 8, 2016

Thank you for the workaround @mheimschild - It would have been nice to have had this resolved already in Webpack 2, even if the empty module would be included as a dev dependency automatically.

@JounQin
Copy link

@JounQin JounQin commented Dec 9, 2016

It seems no need to use empty-module, just change it to null, it still works in ContextReplacementPlugin

new webpack.ContextReplacementPlugin(/\.\/locale$/, null, false, /js$/)

@iqbalmineraltown
Copy link

@iqbalmineraltown iqbalmineraltown commented Mar 13, 2017

just had similar problem when using momentjs via npm
I found that on locales.js it refers to ./locale/
I assume that line trying to find language localization. CMIIW

Meanwhile the locale files are located on ../../locale/ from locale.js
by changing that line into require ('../../locale/' + name); I resolved the issue but I couldn't edit node_modules directly like this on my server

will try webpack way mentioned above later

EDIT: I was running this on windows, it looks like path problem. I tried running moment on linux and it works just fine

@miguelrincon
Copy link

@miguelrincon miguelrincon commented Mar 20, 2017

I used the ignore module with good results. This might help someone:

    // /app/js/webpack.config.js
    plugins: [
        
        // Fixes warning in moment-with-locales.min.js 
        //   Module not found: Error: Can't resolve './locale' in ...
        new webpack.IgnorePlugin(/\.\/locale$/)
    ]
@xiguaaxigua
Copy link

@xiguaaxigua xiguaaxigua commented Mar 21, 2017

@miguelrincon works fine!

@newcaiosantos
Copy link

@newcaiosantos newcaiosantos commented Jun 2, 2017

Awesome. It works!

@maggiepint
Copy link
Member

@maggiepint maggiepint commented Jun 7, 2017

@miguelrincon or similar - can we get a pull request on docs for that? It would be in the use section under webpack.

@stevek-pro
Copy link

@stevek-pro stevek-pro commented Jul 7, 2017

How To Fix in Hybrid Apps Ionic 3.5 with Angular 4 where we have no webpack.config file?

ichernev added a commit that referenced this issue Aug 7, 2017
[bugfix] Make auto locale loading for node not mess webpack, fixes #4031, #2979, #3872
@M1chaelTran
Copy link

@M1chaelTran M1chaelTran commented Sep 26, 2017

I tried @miguelrincon suggestion above but it doesn't work.
i.e. It doesn't throw the error during the build, but the same error is thrown in the browser console log.

After looking around, I found this and it works perfectly!

afc163/react-boilerplate@61ec8a1

\\ webpack.js

resolve: {
   ....
   alias: {
      moment$: 'moment/moment.js',
   },
   ...
}
@marwahaha
Copy link
Member

@marwahaha marwahaha commented Apr 9, 2018

It seems like there's a lot of useful advice in this thread. We'd love to take some PRs on our docs about this! https://github.com/moment/momentjs.com

@it-devros
Copy link

@it-devros it-devros commented Apr 30, 2018

Thanks for all information.

@ugurkoysuren
Copy link

@ugurkoysuren ugurkoysuren commented Jun 11, 2018

UPDATE: I found a solution.

The right way to import :

import * as moment_ from 'moment'; const moment = moment_;

and in ng-package.json:

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

By me was the structure false, the externals was not inside lib, so packgr was looking for lib.externals and couldn't find moment.

Ng-packgr & moment

I'm using the latest version, right now it's 2.22.2.

While I'm trying to use ng-packagr and pack my project, I get this error. Same as : @vZanchiV

'locale' is not exported by 'node_modules\moment\src\moment.js'

BUILD ERROR
Cannot call a namespace ('moment')
Error: Cannot call a namespace ('moment')

In project it's importer in this way :

import * as moment from 'moment';

I found a workaround that didn't went well, I tried importing it like :

import * as momentImported from 'moment'; const moment = momentImported;

After this method I could export my project with ng-packagr but then I failed importing my project in another project, with this problem

Module not found: Error: Can't resolve './locale' in 'C:\development\angularTest\angulartest\node_modules\modulename

@piltsen
Copy link

@piltsen piltsen commented Jul 17, 2018

To confirm @francisrod01 's solution, I have changed my import, so that instead of

import moment from 'moment/min/moment-with-locales'

I changed to

import moment from 'moment'
import 'moment/min/locales'

And this solved for me. Hope it helps.

@anaxamaxan
Copy link

@anaxamaxan anaxamaxan commented Jul 31, 2018

I found the alias solution posted above by @M1chaelTran to work well. In case someone using Laravel Mix is wondering how to apply it, your webpack.mix.js should look similar to this at the top:

let mix = require('laravel-mix');

mix.webpackConfig({
    resolve: {
        alias: {
            moment$: 'moment/moment.js'
        }
    }
});
@withzhaoyu
Copy link

@withzhaoyu withzhaoyu commented Aug 23, 2018

try all solution above, only the 'downgrade moment version' can resolve.But some of my module like 'antd' is require 2.19.0. so I think i can`t downgrade it

@aaronkrohn
Copy link

@aaronkrohn aaronkrohn commented Nov 8, 2018

        new webpack.ContextReplacementPlugin(/^\.\/locale$/, (context) => {
            if (!/\/moment\//.test(context.context)) return;

            Object.assign(context, {
                regExp: /^\.\/\w+/,
                request: '../../locale', // resolved relatively
            });
        }),

This solution worked for me.

@jamesdh
Copy link

@jamesdh jamesdh commented Dec 7, 2018

Appears to be the same issue as #4216 (and #3872 to boot).

Probably best to refer to #4216 since that has the largest history

@vladthelittleone
Copy link

@vladthelittleone vladthelittleone commented May 28, 2019

@aaronkrohn thanks, this solution work with react-boilerplate v.4

@parisudhaandireyaa
Copy link

@parisudhaandireyaa parisudhaandireyaa commented Aug 23, 2019

Try to load locale first instead of moment.min.js.

"moment": [
"../node_modules/moment/locale/en-au.js",
"../node_modules/moment/min/moment.min.js"
]

this will solve my issue.

@yqbk
Copy link

@yqbk yqbk commented Sep 19, 2019

I have moment 2.24.0 and this worked for me finally:

    // Fixes warning in moment-with-locales.min.js
    //   Module not found: Error: Can't resolve './locale' in ..
    new webpack.ContextReplacementPlugin(/^\.\/locale$/, context => {
      if (!/\/moment\//.test(context.context)) return

      Object.assign(context, {
        regExp: /^\.\/\w+/,
        request: '../locale', // resolved relatively
      })
    })

Almost the same as fix of @aaronkrohn , but instead of request: '../../locale', I had to use request: '../locale',.

slaweet added a commit to LiskHQ/lisk-desktop that referenced this issue Sep 20, 2019
@alexandra-grigore
Copy link

@alexandra-grigore alexandra-grigore commented Oct 5, 2019

Here is the fix for this issue:

File: "moment\src\lib\locale\locales.js " line 56:
"./locale" needs to be changed to "../../locale"

Alexandra

@un33k
Copy link

@un33k un33k commented Nov 28, 2019

The fix is simple ...

find any thing like this:

import moment from 'moment/src/moment';

and replace it with this

import * as moment from 'moment';
@mssui
Copy link

@mssui mssui commented May 1, 2020

With create-react-app, below import worked fine for me

import * as moment from "moment/moment.js"

@mtaylor769
Copy link

@mtaylor769 mtaylor769 commented May 1, 2020

With create-react-app, below import worked fine for me

import * as moment from "moment/moment.js"

@mssui 's solution worked for me

@jungor
Copy link

@jungor jungor commented May 2, 2020

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

add above to package.json and re yarn. ok for me

@snabbat
Copy link

@snabbat snabbat commented May 2, 2020

webpack.config.js

please where can I find this file, I can't find the path you referenced to, Thank in advance,

I did a workaround by copying the moment source folder from an older project, and it worked for me

@marwahaha
Copy link
Member

@marwahaha marwahaha commented Sep 15, 2020

@marwahaha marwahaha closed this Sep 15, 2020
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Linked pull requests

Successfully merging a pull request may close this issue.

None yet