Error importing component from forked npm package

Question

So, I'm making a small chat tool using react-chat-elements as UI library for chat components. I'd like to modify certain CSS values to match what I want to build without being tied to that specific library the way it is now (it hasn't been updated since 5 months ago).

So what I tried is fork it to my Github account, created the NPM package from it (react-chat-elements-av) without making any changes first to make sure it worked the same way as with the original. However, when I import a specific component from the NPM package I created, say import { MessageBox, SystemMessage } from "react-chat-elements-av"; , I get an error saying Attempted import error: 'MessageBox' is not exported from 'react-chat-elements-av'. , being the attempted import location: /node_modules/react-chat-elements-av/index.

Now, if I import those two components from the original NPM package, import { MessageBox, SystemMessage } from "react-chat-elements"; , everything works and the import location is a bit different: /node_modules/react-chat-elements/dist/main.

Is there something I'm missing on the creation of that dist directory when doing npm install react-chat-elements-av ? I literally forked the original repo, and created the NPM package with it, no changes made to any webpack config or so.

Any idea what could be happening here?

Thanks in advance!

Answer 1

The dist repository is for production grade code after it has been built. It's the distribution file. try seeing how they have built their library by running npm run build once you've downloaded it.