'How do I resolve "Uncaught TypeError: iterable.hasOwnProperty is not a function"?

I am trying to use the react-leaflet-markerclusters package in my code. However after installing it and running npm start, I am getting this error (

loadMessages.js?4a62:4 Uncaught TypeError: iterable.hasOwnProperty is not a function
    at traverse (loadMessages.js?4a62:4:1)
    at loadMessages (loadMessages.js?4a62:25:1)
    at eval (Root.js?e933:41:13)
    at Module../src/masterApp/components/app/Root.js (bundle.js:49970:1)
    at __webpack_require__ (bundle.js:790:30)
    at fn (bundle.js:101:20)
    at eval (index.js?b635:1:1)
    at Module../src/index.js (bundle.js:49802:1)
    at __webpack_require__ (bundle.js:790:30)
    at fn (bundle.js:101:20)

) and a white screen.

I did a global search in my application for hasOwnProperty and there are no results. I'm assuming this is tied to an external package. After further digging, it seems like it is tied to my loadMessages import in Root.js.

Here's a snippet of Root.js:

import "core-js/stable";
import "regenerator-runtime/runtime";
import React from "react";
...
import { loadMessages, LocalizationProvider } from "@progress/kendo-react-intl";
import messages from "../../../assets/messages/messages";

loadMessages(messages.ar, "ar");
loadMessages(messages.en, "en");
loadMessages(messages.es, "es");
loadMessages(messages.fr, "fr");

I've tried updating @progress/kendo-react-intl to the latest version but I still get the TypeError. Do I need a prefix in front of loadMessages?

If it helps any, please note that I am using node 14.4.0 and babel 7. Updating node beyond this version causes a node-sass error. Should I downgrade babel?

node.jsreactjsnpmbabeljsreact-leaflet


Solution 1:[1]

I had to change:

loadMessages(messages.ar, "ar");
loadMessages(messages.en, "en");
loadMessages(messages.es, "es");
loadMessages(messages.fr, "fr");

To be:

loadMessages(JSON.stringify(messages.ar), "ar");
loadMessages(JSON.stringify(messages.en), "en");
loadMessages(JSON.stringify(messages.es), "es");
loadMessages(JSON.stringify(messages.fr), "fr");

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1 maestro777

Related Questions