Using a component imported from an npm package in two different apps has resulted in unexpected behavior. In one app, the component functions perfectly as expected. However, in the other app, an error is raised:
Element type is invalid: expected a string (for built-in components) or a class/function (for composite components) but got: object.
This discrepancy raises the question of why the error only occurs in one app when both apps use the same package version and import method.
The imported element is a React Component bundled in commonJS. It is the sole exported element, so it is imported using:
import ProductImage from '@balibart/product-image'
In both cases, the component is passed the same props. The component is designed to render an SVG and is exported using:
module.exports = [a function]
Testing the component by copying its content into a separate file and importing it directly renders it correctly. This leads to the assumption that the issue lies in how create-react-app imports the component. Although the CRA version used for both apps should be identical...