Reviving a 12K+ Star Abandoned Library: toastr-next v3

说明与用途

toastr-next v3 是一个轻量、现代、可访问的通知库，替代了已被废弃的 toastr。它消除了 jQuery，添加了 TypeScript、暗黑模式、Promise API 和 React 包装器，将包大小压缩到约 4 KB gzipped。

问题

The original toastr library was abandoned in 2016, required jQuery, had no TypeScript, dark mode, accessibility, or modern build tools, making it unusable in modern projects.

结果

toastr-next v3 delivers a lightweight, modern, accessible notification library that can be dropped into any project without jQuery, with full TypeScript support, dark mode, Promise API, and built‑in React integration, reducing bundle size from ~87 KB to ~4 KB gzipped.

工作流

• 1. Analyzed original source to identify core API surface (success, error, info, warning).
• 2. Designed TypeScript interfaces for options, response, and events, adding a dismissed Promise to each toast.
• 3. Implemented CSS‑first theming with auto dark mode via prefers‑color‑scheme and manual override via data‑theme attribute.
• 4. Added WCAG 2.1 AA compliant ARIA roles: alert for error/warning, status for success/info.
• 5. Created a Vite generateBundle plugin to self‑inject CSS into every JS chunk, guarded against duplicate injection and SSR.
• 6. Built a live demo page with theme toggle, animation showcase, and before/after comparison.
• 7. Used GitHub Copilot throughout to suggest patterns, catch bugs, and audit the codebase for anti‑patterns.

证据

toastr was the go-to notification library for millions of developers. But time wasn't kind to it.

来源

~4 KB gzipped. No jQuery. No bloat. Just toasts.

来源

Copilot flagged that role="alert" is assertive and suggested role="status" for success/info.

来源