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?
See #1435. Workaround at the end. Thanks.
the suggested workaround in "plugins" of webpack.config.js
new webpack.ContextReplacementPlugin(/moment[\\\/]locale$/, /^\.\/(en|de|cz|eu)$/)
did not work
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.
@ichernev - I don't use webpack, but it seems like the point @mheimschild makes is reasonable. Not sure how to handle it though.
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.
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.
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$/)
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
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$/)
]
@miguelrincon works fine!
Awesome. It works!
@miguelrincon or similar - can we get a pull request on docs for that? It would be in the use section under webpack.
How To Fix in Hybrid Apps Ionic 3.5 with Angular 4 where we have no webpack.config file?
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!
https://github.com/afc163/react-boilerplate/commit/61ec8a19df0fcb56d407b795cb6c87141e0e14a7
\\ webpack.js
resolve: {
....
alias: {
moment$: 'moment/moment.js',
},
...
}
This problem has appeared for me in moment.js 2.19.0. If you need to get your application working right now a rollback should do it. For example:
npm install [email protected] --save
Thank you @jeff3dx This fixed my issue!
@jeff3dx I had exactly the same happening with the latest version, but adding the resolve alias as suggested by @M1chaelTran still does the trick.
I confirm that sticking to 2.18 fixes the issue immediately.
Same here. Using React 16, installed moment 2.19 and got errors. Reverted back to 2.18, no errors.
dear, I solve it!
src/lib/locale/locales.js in line 61,
61 require('./locale/' + name);
change to be:
61 require('./' + name);
"moment with locales: "./locale" not found" will be solve.
@wushuang5112 you cant edit a node_module , so your solution would required to add moment in to the repository , which is not good
We also just had a problem when upgrading to moment 2.19 in an app also using react and webpack. Reverting to 2.18 fixed it.
Instead of just rolling back I would use @M1chaelTran 's solution of using an alias for momentjs inside of webpack config. Worked like a charm and allows me to keep using latest.
solved! ...v2.19.1
@M1chaelTran man you are a blessing, thank you so much!!!
I'm still seeing the issue in v2.19.1
WARNING in ./~/moment/src/lib/locale/locales.js
Module not found: Error: Can't resolve './locale' in '/project/node_modules/moment/src/lib/locale'
@ ./~/moment/src/lib/locale/locales.js 56:12-46
@ ./~/moment/src/lib/locale/locale.js
@ ./~/moment/src/moment.js
@ dll reactBoilerplateDeps
However, @M1chaelTran alias trick did work for me.
@electrobabe I think that problem is ... the doc is outdated about this. so...
To solve this: Can't resolve './locale' in
, try to import moment
and min/locales
instead moment-with-locales
. It's fixed to me!
The better reference for this is:
http://momentjs.com/docs/#/i18n/loading-into-browser/
Downgrading to 2.18 does not solve the issue for me. Still have this : Error: Cannot find module "./locale"
The strange thing is that to fix this:
react-native
project I have to import moment-with-locales
filereactjs
project I just have to import moment/locales
file @manelephant I think this solve the problem: https://github.com/moment/moment/issues/2979#issuecomment-346636284
Downgrading to 2.18 does not solve the issue for me.
i use angular cli.
moment worked but when i want export my component with npm run packagr ==>
Compiling to FESM15
'locale' is not exported by 'node_modulesmoment\srcmoment.js'
BUILD ERROR
Cannot call a namespace ('moment')
Error: Cannot call a namespace ('moment')
somebody can help me ?
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
Thanks for all information.
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_modulesmoment\srcmoment.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\angulartestnode_modules\modulename
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.
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'
}
}
});
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
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.
Appears to be the same issue as #4216 (and #3872 to boot).
Probably best to refer to #4216 since that has the largest history
@aaronkrohn thanks, this solution work with react-boilerplate v.4
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.
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',
.
Here is the fix for this issue:
File: "moment\src\liblocalelocales.js " line 56:
"./locale" needs to be changed to "../../locale"
Alexandra
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';
With create-react-app, below import worked fine for me
import * as moment from "moment/moment.js"
With create-react-app, below import worked fine for me
import * as moment from "moment/moment.js"
@mssui 's solution worked for me
"resolutions": {
"moment": "2.24.0"
}
add above to package.json and re yarn. ok for me
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
See https://momentjs.com/docs/#/-project-status/
Most helpful comment
I used the ignore module with good results. This might help someone: