Module not found: Error: Can't resolve 'date-fns/add_days'

Describe the bug I am unable to compile the application with ng serve after adding Angular-Calendar to the app module as per instructions. The following errors are output:

ERROR in ./node_modules/calendar-utils/dist/calendar-utils.js Module not found: Error: Can’t resolve ‘date-fns/add_days’ in ‘C:\Users\Matt\Source\Repos\CPanel\node_modules\calendar-utils\dist’ ERROR in ./node_modules/calendar-utils/dist/calendar-utils.js Module not found: Error: Can’t resolve ‘date-fns/add_hours’ in ‘C:\Users\Matt\Source\Repos\CPanel\node_modules\calendar-utils\dist’ ERROR in ./node_modules/calendar-utils/dist/calendar-utils.js Module not found: Error: Can’t resolve ‘date-fns/add_minutes’ in ‘C:\Users\Matt\Source\Repos\CPanel\node_modules\calendar-utils\dist’ ERROR in ./node_modules/calendar-utils/dist/calendar-utils.js Module not found: Error: Can’t resolve ‘date-fns/add_seconds’ in ‘C:\Users\Matt\Source\Repos\CPanel\node_modules\calendar-utils\dist’ ERROR in ./node_modules/calendar-utils/dist/calendar-utils.js Module not found: Error: Can’t resolve ‘date-fns/difference_in_days’ in ‘C:\Users\Matt\Source\Repos\CPanel\node_modules\calendar-utils\dist’ ERROR in ./node_modules/calendar-utils/dist/calendar-utils.js Module not found: Error: Can’t resolve ‘date-fns/difference_in_minutes’ in ‘C:\Users\Matt\Source\Repos\CPanel\node_modules\calendar-utils\dist’ ERROR in ./node_modules/calendar-utils/dist/calendar-utils.js Module not found: Error: Can’t resolve ‘date-fns/difference_in_seconds’ in ‘C:\Users\Matt\Source\Repos\CPanel\node_modules\calendar-utils\dist’ ERROR in ./node_modules/calendar-utils/dist/calendar-utils.js Module not found: Error: Can’t resolve ‘date-fns/end_of_day’ in ‘C:\Users\Matt\Source\Repos\CPanel\node_modules\calendar-utils\dist’ ERROR in ./node_modules/calendar-utils/dist/calendar-utils.js Module not found: Error: Can’t resolve ‘date-fns/end_of_month’ in ‘C:\Users\Matt\Source\Repos\CPanel\node_modules\calendar-utils\dist’ ERROR in ./node_modules/calendar-utils/dist/calendar-utils.js Module not found: Error: Can’t resolve ‘date-fns/end_of_week’ in ‘C:\Users\Matt\Source\Repos\CPanel\node_modules\calendar-utils\dist’ ERROR in ./node_modules/calendar-utils/dist/calendar-utils.js Module not found: Error: Can’t resolve ‘date-fns/get_day’ in ‘C:\Users\Matt\Source\Repos\CPanel\node_modules\calendar-utils\dist’ ERROR in ./node_modules/calendar-utils/dist/calendar-utils.js Module not found: Error: Can’t resolve ‘date-fns/is_date’ in ‘C:\Users\Matt\Source\Repos\CPanel\node_modules\calendar-utils\dist’ ERROR in ./node_modules/calendar-utils/dist/calendar-utils.js Module not found: Error: Can’t resolve ‘date-fns/is_same_day’ in ‘C:\Users\Matt\Source\Repos\CPanel\node_modules\calendar-utils\dist’ ERROR in ./node_modules/calendar-utils/dist/calendar-utils.js Module not found: Error: Can’t resolve ‘date-fns/is_same_month’ in ‘C:\Users\Matt\Source\Repos\CPanel\node_modules\calendar-utils\dist’ ERROR in ./node_modules/calendar-utils/dist/calendar-utils.js Module not found: Error: Can’t resolve ‘date-fns/is_same_second’ in ‘C:\Users\Matt\Source\Repos\CPanel\node_modules\calendar-utils\dist’ ERROR in ./node_modules/calendar-utils/dist/calendar-utils.js Module not found: Error: Can’t resolve ‘date-fns/set_hours’ in ‘C:\Users\Matt\Source\Repos\CPanel\node_modules\calendar-utils\dist’ ERROR in ./node_modules/calendar-utils/dist/calendar-utils.js Module not found: Error: Can’t resolve ‘date-fns/set_minutes’ in ‘C:\Users\Matt\Source\Repos\CPanel\node_modules\calendar-utils\dist’ ERROR in ./node_modules/calendar-utils/dist/calendar-utils.js Module not found: Error: Can’t resolve ‘date-fns/start_of_day’ in ‘C:\Users\Matt\Source\Repos\CPanel\node_modules\calendar-utils\dist’ ERROR in ./node_modules/calendar-utils/dist/calendar-utils.js Module not found: Error: Can’t resolve ‘date-fns/start_of_minute’ in ‘C:\Users\Matt\Source\Repos\CPanel\node_modules\calendar-utils\dist’ ERROR in ./node_modules/calendar-utils/dist/calendar-utils.js Module not found: Error: Can’t resolve ‘date-fns/start_of_month’ in ‘C:\Users\Matt\Source\Repos\CPanel\node_modules\calendar-utils\dist’ ERROR in ./node_modules/calendar-utils/dist/calendar-utils.js Module not found: Error: Can’t resolve ‘date-fns/start_of_week’ in ‘C:\Users\Matt\Source\Repos\CPanel\node_modules\calendar-utils\dist’

Minimal reproduction of the problem with instructions Install it. Add it to app module. Ng serve.

Screenshots

Versions:

• @angular/core: 5.0.2 (CLI 1.7.4)
• angular-calendar: 0.23.1 (also tried 0.24.1)
• Browser name and version: n/a

I found the following thread which seems to have the same error (although for a different package), the solution there was to install a version of date-fns above 2.x which I’ve done to no effect. https://github.com/dmtrKovalenko/material-ui-pickers/issues/349

[jbbeirnaert]

‘calendar-utils’ is using the ‘date-fns’ library. However, ‘date-fns’ changed many names of his folder from version 1.x to 2.x (exemple ‘add_days’ to ‘addDays’). This is why you have those errors.

Then you should install an older version of ‘date-fns’ (the last 1.x). You can see all the version of a package by doing : npm view date-fns versions Look at the last 1.x, and update it ! (for me it is : 1.30.1)

To sumurize, you should do: npm uninstall date-fns --save npm install --save date-fns@1.30.1

(if you have an error of overrighting date-fns, don’t hesitate to delete it directly form node_module before installing again)

I hope it will help others 😃

[woodm1]

Absolutely typical that after struggling with this all day the first thing I try after posting the issue gets it to work 😄

Admittedly I discounted that thread because it was on a much older version. Lesson learned.

The last reply to this: https://github.com/mattlewis92/angular-calendar/issues/85 did the trick (included below).

I had the same errors, I figured this out, just add these packages to your package.json file . I don’t think it is mentioned in the library though

“dependencies”: { “angular-draggable-droppable”: “^1.1.1”, “angular-resizable-element”: “^1.2.4”, “calendar-utils”: “0.0.59”, “date-fns”: “^1.28.5”, “positioning”: “^1.3.1” }

then, npm install

Hope this helps anyone else with the same problem.