Posts

Showing posts from March, 2024

React lazy component (import component)

Image
Let's face it - there are some problems with React & Webpack. When I create a Webpack bundle - All the files (js and css) are merged. (remember files Name Must Start with Capital letter- js , css,..) It means that if I have some styles with the same name, the style will be applied on all the elements. Ex: In A component - there is an element like this: <Button className="mybutton" label="close" /> with style like this: .mybutton {color:red} In B component - there is element with the same class name <Button className="mybutton" label="open" /> So because I used the same style css class name - the Webpack bundle merged the css files of all the components, its means that we got red color to all components that use the same name. In the example component B got red color for the button. I call it a bug (not a feature 😀) In my project I created an app.js. In this file I import all the components. There, I noticed that as I mentione...