Cause: Component re-renders creating duplicate instances
Solution: Use useRef to track initialization (already in examples above)
Cause: Script loads after component renders
Solution: Add null check:
if (window.SocialShareButton) {
new window.SocialShareButton({ container: '#share-button' });
}Cause: CSS not loaded or ID mismatch
Solution:
- Verify CSS CDN link in
<head> - Match container ID:
container: '#share-button'=<div id="share-button">
Cause: CDN script not loaded yet
Solution: Use interval polling (see Next.js example above)
Cause: Component initialized once, doesn't track routes
Solution: Use updateOptions() method (see Advanced Usage above)