Uncaught Error: Invariant Violation: Element type is invalid: expected a string (for built-in components) or a class/function but got: object

Question

I am getting this error:

Uncaught Error: Invariant Violation: Element type is invalid: expected a string (for built-in components) or a class/funct

Answer 1

I ran into this error when I had a .jsx and .scss file in the same directory with the same root name.

So, for example, if you have Component.jsx and Component.scss in the same folder and you try to do this:

import Component from ./Component

Webpack apparently gets confused and, at least in my case, tries to import the scss file when I really want the .jsx file.

I was able to fix it by renaming the .scss file and avoiding the ambiguity. I could have also explicitly imported Component.jsx