'How to share a private Design System across multiple projects?

I've an architectural question.

I have a component-based Design System library that I share across multiple projects. Everything is developed in ReactJS. One project is a monolyth and another is microfrontend-driven (with SingleSPA). As soon as the projects get big and the UX/UI needings grow up, I'm encountering some difficulties in sharing it across those projects.

An example could be that project A needs some sort of css customization, but that customization completely breaks project B. So I end up fixing that for B but I've got drawbacks for A and so on.

As a general rule I adopted, I want to avoid as much as possible inline styles and css files inside the projects, writing all the style code inside the Design System.

I want to understand if my approach is fine or I'm taking the wrong path.
Thinking about "famous" design systems (AntD, Material, Bootstrap, ...) they are all abstract and it's the final application that relies on them, while I'm trying to develop on the D.S. what I need on the final projects.

Is there a way to improve my technique?



Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source