I am trying to create a custom UI library component for my small applications.

Firstly I learnt how to create react app with bite, then build reusable React UI components, next how to create a build and publish to npm.

In the generated npm dist, I see all of my components are placed into one .js file.

How to create single file but per component, and keep my files’ distribution as it is.

I noted there are many libraries that are doing what I am trying to do, such as MUI, PrimeReact, etc.

for example, this is my generated build dist file:

My aim is to structure the final build like this:

to be maintainable and easy to read and navigate.

Here is my GitHub repo if you want to check it.