{"slug": "the-missing-github-icon-that-broke-my-production-build", "title": "The Missing GitHub Icon That Broke My Production Build", "summary": "A developer building K-XpertAI, an AI agent that manages files in a live project workspace, encountered a production build failure on Vercel caused by a missing `Github` icon export from the `lucide-react` library. The icon had been silently removed from the library's default exports due to trademark concerns, but local development cached the old version, masking the issue. The fix involved replacing the import with a small inline SVG component.", "body_md": "*This is a submission for DEV's Summer Bug Smash: Smash Stories powered by Sentry.*\n\nI'm building [KingxTech](https://kingxtech.name.ng), and specifically **K-XpertAI** — an AI agent that reads, writes, and deletes files in a live project workspace, then hosts the result instantly. Under the hood it's a React 19 + Vite frontend talking to a TypeScript/Express backend on Cloud Run.\n\nI'd just shipped a big batch of changes to the workspace UI — a proper code editor, a file tree with GitHub import/export buttons, a terminal tab. Pushed to GitHub, Vercel kicked off the deploy... and it failed.\n\n```\nError: Command \"npm run build\" exited with 1\n```\n\nDigging into the build log, the real error was buried a few lines down:\n\n``` js\n15 │ import { File as FileIcon, Folder, FolderPlus, FilePlus, Trash2, Save,\n   │   RefreshCw, Undo2, Copy, ExternalLink, Code2, Eye, Rocket,\n   │   TerminalSquare, Upload, Maximize2, Minimize2, Github, FolderInput,\n   │   SlidersHorizontal, Info, Plus } from \"lucide-react\";\n   │ ───┬──\n   │ ╰──── Missing export\n```\n\nVite's bundler (via Rolldown) was telling me `Github`\n\ndidn't exist as an export in `lucide-react`\n\n— but only in Vercel's build. It worked fine in local dev. That's the kind of bug that makes you doubt your own eyes: the icon was clearly imported the same way as a dozen others on that same line that worked perfectly.\n\nFirst instinct: check the installed version.\n\n```\n\"lucide-react\": \"^1.23.0\"\n```\n\nNothing obviously wrong there. So instead of guessing at what icon names *should* exist, I installed that exact version in an isolated sandbox and just asked the module directly:\n\n``` js\nconst icons = require('lucide-react');\nconst names = ['Github', 'FolderInput', 'SlidersHorizontal', /* ...the rest */];\nfor (const n of names) {\n  console.log(n, typeof icons[n] !== 'undefined' ? 'OK' : 'MISSING');\n}\nGithub MISSING\nFolderInput OK\nSlidersHorizontal OK\n...everything else OK\n```\n\nThere it was. Every icon in that import worked *except* `Github`\n\n.\n\n`lucide-react`\n\n— like a lot of modern icon libraries — has been progressively removing brand/trademark logos (GitHub, Twitter, etc.) from its default export set, pushing people toward dedicated brand-icon packages instead. Somewhere between versions, the plain `Github`\n\nicon quietly stopped being exported. Local dev didn't catch it because of caching in `node_modules`\n\nfrom an earlier install; a clean Vercel build (fresh `npm install`\n\nevery time) surfaced it immediately.\n\nThe fix wasn't \"install a different package\" — it was small enough to just inline:\n\n``` js\n// Before: relying on a brand icon that no longer ships\nimport { Github } from 'lucide-react';\n\n// After: a tiny local SVG component instead\nfunction Github({ size = 14 }) {\n  return (\n    <svg width={size} height={size} viewBox=\"0 0 24 24\" fill=\"currentColor\">\n      <path d=\"M12 .5C5.7.5.5 5.7.5 12c0 5.1 3.3 9.4 7.9 10.9...\" />\n    </svg>\n  );\n}\n```\n\nSame component name, same usage everywhere else in the file — zero call-site changes needed.\n\nSince the whole failure was \"works locally, fails in CI,\" I didn't trust a visual read of the diff. I ran the actual production build in a clean environment:\n\n```\nnpm install\nnpm run build\n✓ 1902 modules transformed.\ndist/index.html                     1.44 kB\ndist/assets/index-*.css            24.68 kB\ndist/assets/index-*.js           1,185.88 kB\n✓ built in 3.16s\n```\n\nClean exit code, real `dist/`\n\noutput. Only then did I consider it actually fixed.\n\n`node_modules`\n\ncan hide exactly this class of bug. A clean install is the only honest test.Small bug, but a good reminder that \"it built yesterday\" is not evidence of anything today.", "url": "https://wpnews.pro/news/the-missing-github-icon-that-broke-my-production-build", "canonical_source": "https://dev.to/alkhassim_lawalumar/the-missing-github-icon-that-broke-my-production-build-b1c", "published_at": "2026-07-24 19:19:48+00:00", "updated_at": "2026-07-24 19:32:48.337291+00:00", "lang": "en", "topics": ["developer-tools", "ai-agents"], "entities": ["KingxTech", "K-XpertAI", "Vercel", "lucide-react", "GitHub"], "alternates": {"html": "https://wpnews.pro/news/the-missing-github-icon-that-broke-my-production-build", "markdown": "https://wpnews.pro/news/the-missing-github-icon-that-broke-my-production-build.md", "text": "https://wpnews.pro/news/the-missing-github-icon-that-broke-my-production-build.txt", "jsonld": "https://wpnews.pro/news/the-missing-github-icon-that-broke-my-production-build.jsonld"}}