Skip to content

StaxTech/react-native-sourcemap-deminifier

Repository files navigation

📍 SourceMap Deminifier

Beautiful • Practical • Browser-only
Instantly de-minify React Native production JavaScript errors using your .map sourcemaps.

License: MIT TypeScript Vite + React + Tailwind

Try it live → deminifier.StaxTech.com (or your own subdomain)


✨ Why this exists

React Native production errors (especially from Hermes or Metro) are painful — they show up as minified stacktraces with cryptic file names like index.bundle:415:10.

SourceMap Deminifier fixes that in seconds:

  • Upload your production .map file (generated by react-native build)
  • Paste a line + column or the full stacktrace
  • Get clean, original file paths, function names, and code snippets instantly
  • 100% client-side — no data leaves your browser

Built on the exact same engine as the excellent source-map-lookup CLI, but with a gorgeous, practical React SPA UI.

🚀 Features

  • Single-position lookup with live debounced preview
  • Full stacktrace de-minification (Hermes & Metro formats)
  • Embedded source code snippets with line highlighting
  • Copy-ready de-minified results
  • Beautiful dark UI with glassmorphic cards, smooth animations, and code syntax styling
  • Error handling & helpful toasts
  • Mobile-friendly responsive design
  • Zero server — works completely offline after loading the sourcemap
  • FOSS forever — fork it, host it, improve it

📸 Screenshots

(Add your actual screenshots here — I recommend 3: top bar with upload, side-by-side input/output, and a stacktrace example)

🛠️ Quick Start

  1. Go to deminifier.StaxTech.com
  2. Drag & drop your production .map file (from android/app/build/outputs or iOS equivalent)
  3. Paste a line + column from your error or the full stacktrace
  4. Watch the magic happen ✨

🧑‍💻 Local Development

git clone https://github.com/StaxTech/react-native-sourcemap-deminifier.git
cd react-native-sourcemap-deminifier
npm install
npm run dev

Open http://localhost:5173 — you're ready to hack!

Tech Stack

  • React 18 + TypeScript
  • Vite (blazing fast)
  • Tailwind CSS + custom dark theme
  • source-map (official Mozilla library with WASM)
  • error-stack-parser
  • Fully client-side (no backend)

🚀 Deployment (one-click)

  • Vercel / Netlify: Connect your repo — done
  • Cloudflare Pages: Drag & drop the dist folder
  • Custom subdomain: deminifier.gidraphdanford.dev (highly recommended)

See the Deployment Guide for production tips.

❤️ Contributing

We ❤️ contributors! This project is fully open-source and designed to be easy to extend.

Please read our CONTRIBUTING.md before opening a PR.

License

MIT © StaxTech Inc


Made with ❤️ for the React Native community
Built by StaxTech • Inspired by source-map-lookup

Star ⭐ this repo if it saved you debugging time!

About

No description, website, or topics provided.

Resources

License

Contributing

Stars

Watchers

Forks

Releases

No releases published

Packages

 
 
 

Contributors