Debugging Rollup Config for CSS Imports in React Components - Episode 190
In this video, I delve into tackling a challenging issue with handling CSS imports in a Rollup configuration for a React component library. Specifically, I'm addressing a problem where the generated CSS contains relative URLs pointing to resources within Node modules, which are not accessible when deployed. This technical deep dive explores strategies to properly inject and manage these styles effectively within the project build process. Along the way, I attempt solutions like using different Rollup plugins (e.g., PostCSS) and tweaking configuration options to resolve the issue, sharing my thought process and debugging steps in real time. Despite the challenges, it's all part of the joy of figuring things out live. The back and forth with the community in the chat offered great insights and questions, making this problem-solving session even more engaging and informative!
Apart from debugging, we also took detours to discuss software development journeys, career advice, coding mentorship, and interview challenges. I share my experiences, insights on becoming a self-taught web developer, and the importance of practice when it comes to coding and interviewing. It was a rewarding conversation, touching on generalist vs. specialist career paths as well as the power of perseverance when navigating the job hunt as a developer in today’s hiring landscape.
Throughout the stream, I shared resources, answered questions, and celebrated some milestones like community members joining the Discord channel and a string of new Twitch followers. It’s always great to meet fellow full-stack developers and enthusiasts, especially during these coding streams.
🔗 Check out my Twitch channel for more streams: https://www.twitch.tv/saebyn
GitHub: https://github.com/saebyn
Discord: https://discord.gg/N7xfy7PyHs