Import from folder through index.js
SOLUTION: Restart the developmental server.
EXPLANATION
I've figured it out, somewhat. In short, all I had to do was restart the developmental server.
Details for the curious. Before I decided to make Report a folder, it was a file in the same folder as myfile.js.
├── myfile.js
├── Report.js
I had a developmental server running locally, and everything was working just fine.
Then I created a new folder Report and moved Report.js into it using git mv Report.js Report/index.js all the while the developmental server was still running and it stopped working.
I'm not sure why that didn't work exactly (I seem to recall a different error message than the one excerpted in my post), but I thought my default export was the problem, and set about changing it.
The developmental server of course recognized the changes I made to the files, but apparently it still thought the deleted Report.js still existed, whether as a blank file or an old version or whatever. With import { Report } from './Report'; it would fetch or try to fetch the old Report.js and failed, whereas with import { Report } from './Report/index'; knew exactly where to go and worked as expected.
Once restarted, the server no longer sees the phantasmic Report.js and thus searches for Report/index.js next, as it's supposed to. Every thing works now, including w/ the original default export/import.
Since your file name is index.js, these two lines are equivalent:
import { Report } from './Report'; // by default, the module system will look for the index.js file inside a folder
import { Report } from './Report/index';
Hence, there is no reason for the second approach worked but the first one didn't
In your case, because you're using the default export rather than named export, in order to use the exported module, these both ways will work for you:
import Report from './Report'
import Report from './Report/index';
UPDATE
Attempted import error: 'Report' is not exported from './Report'.
This error is telling us that we're trying to import a named export module but the module system can't find any named export modules with the name Report. It's obvious because we're using default export rather than named export.
UPDATE
This is a working demo: https://codesandbox.io/s/m7vp982m2p You can use it as a reference, then looking back to your code and you will figure out why your code doesn't work.
It looks like you are not actually exporting an Object from your class, which means you don't need the braces like this:
import { Report } from './Report';
Like Austin Greco said, you should remove the braces, because you are only exporting one thing, which is the class Report.
import Report from './Report';