React & Frontend Errors
219 articles in this category
Frontend errors fall into a few predictable buckets: framework-specific rules you violated (React hooks, Vue reactivity, Svelte reactivity), build/bundler problems (Vite, webpack, module resolution), CSS that does not behave like you expected, and hydration mismatches when SSR meets the client.
This hub collects every frontend fix on the site. If you are seeing a console warning, a broken layout, or a hydration error, start here — pages are grouped by framework so you can jump straight to your stack.
Most common starting points:
- React Hydration Error — the #1 SSR mistake.
- Each child should have a unique key — the most common React warning, and a real performance footgun.
- Next.js 500 Internal Server Error — production-only crashes.
React (111)
Fix: Inertia.js Not Working — Shared Data, Lazy Props, Versioning, Forms, and SSR
How to fix Inertia.js errors — Inertia.render not returning a component, shared data missing on every page, lazy props not deferring, asset versioning forcing reloads, useForm helper, and SSR setup.
Fix: next-themes Not Working — Hydration Mismatch, Tailwind Dark Mode, FOUC, and System Preference
How to fix next-themes errors — hydration mismatch on mount, FOUC flash before theme applies, Tailwind dark: classes not switching, ThemeProvider in App Router, defaultTheme system not respected, and TypeScript types.
Fix: PGlite Not Working — IndexedDB Persistence, Worker Setup, Extensions, and Live Queries
How to fix PGlite errors — async init not awaited, IndexedDB persistence lost on reload, Web Worker isolation, pgvector and other extensions, live queries with @electric-sql/pglite-react, and migration patterns.
Fix: Playwright Component Testing Not Working — Mount Fixture, Vite Config, Styles, and TypeScript
How to fix Playwright component testing errors — playwright-ct.config not found, mount fixture undefined, CSS not loaded in tests, Vite alias for imports, TypeScript paths, hooks (beforeMount), and snapshot strategy.
Fix: React 19 Actions Not Working — useActionState, useFormStatus, useOptimistic, and form action
How to fix React 19 actions errors — useActionState signature, form action vs onSubmit, useFormStatus must be in child, useOptimistic state desync, Server Actions in client components, and error handling.
Fix: Supabase Realtime Not Working — RLS Filters, Channel Subscribe, Presence, and Broadcast
How to fix Supabase Realtime errors — postgres_changes subscription not firing, RLS blocking events, channel.subscribe callback timing, presence diff payloads, broadcast vs database events, auth refresh, and reconnection.
Fix: tldraw Not Working — Store Persistence, Custom Shapes, Sync, and Asset Uploads
How to fix tldraw errors — Tldraw component blank screen, persistenceKey vs server sync, custom shape util, asset upload handler, undo/redo, dark mode, snapshot vs store load, and tldraw sync server.
Fix: Next.js 'params should be awaited before using its properties'
How to fix Next.js 15 async params and searchParams errors — await in Server Components, React.use in Client Components, generateMetadata, generateStaticParams, and the codemod migration path.
Fix: React Compiler Not Working — ESLint Plugin, Babel Setup, Bail-Outs, and Vite/Next.js Config
How to fix React Compiler issues — eslint-plugin-react-compiler not flagging, babel-plugin-react-compiler not running, 'Function contains a code construct that prevents compilation', Next.js 15 config, and removing useMemo/useCallback safely.
Fix: React Router 7 Not Working — Framework Mode, Loaders, Type Safety, and Remix Migration
How to fix React Router v7 errors — framework mode vs library mode setup, loader/action data type narrowing, route module exports missing, single-fetch revalidation, hydration mismatch, and Remix v2 migration paths.
Fix: SWR Not Working — Key Changes, Mutate Not Updating, Conditional Fetching, and SSR Hydration
How to fix SWR errors — useSWR not refetching on key change, mutate not invalidating, conditional null key, fallbackData vs fallback, SSR hydration mismatch, infinite scroll pagination, and TypeScript typing.
Fix: TanStack Form Not Working — Field Types, Validators, Async Validation, and Subscription Re-renders
How to fix TanStack Form errors — field name not typed, zod/valibot validators not running, async onChange race conditions, listener not firing, array field state, and SSR with Server Actions.
Fix: Chakra UI Not Working — Provider Missing, Styles Not Applied, or Dark Mode Broken
How to fix Chakra UI v3 issues — ChakraProvider setup, color mode, theming, server-side rendering in Next.js, component styling, and common runtime errors.
Fix: Tamagui Not Working — Styles Not Applying, Compiler Errors, or Web/Native Mismatch
How to fix Tamagui UI kit issues — setup with Expo, theme tokens, styled components, animations, responsive props, media queries, and cross-platform rendering.
Fix: TanStack Start Not Working — Server Functions Failing, Routes Not Loading, or SSR Errors
How to fix TanStack Start issues — project setup, file-based routing, server functions with createServerFn, data loading, middleware, SSR hydration, and deployment configuration.
Fix: Waku Not Working — Server Components Not Rendering, Client Components Not Interactive, or Build Errors
How to fix Waku React framework issues — RSC setup, server and client component patterns, data fetching, routing, layout system, and deployment configuration.
Fix: Wasp Not Working — Build Failing, Auth Not Working, or Operations Returning Empty
How to fix Wasp full-stack framework issues — main.wasp configuration, queries and actions, authentication setup, Prisma integration, job scheduling, and deployment.
Fix: AutoAnimate Not Working — Transitions Not Playing, List Items Not Animating, or React State Changes Ignored
How to fix @formkit/auto-animate issues — parent ref setup, React useAutoAnimate hook, Vue directive, animation customization, disabling for specific elements, and framework integration.
Fix: Better Auth Not Working — Login Failing, Session Null, or OAuth Callback Error
How to fix Better Auth issues — server and client setup, email/password and OAuth providers, session management, middleware protection, database adapters, and plugin configuration.
Fix: Blurhash Not Working — Placeholder Not Rendering, Encoding Failing, or Colors Wrong
How to fix Blurhash image placeholder issues — encoding with Sharp, decoding in React, canvas rendering, Next.js image placeholders, CSS blur fallback, and performance optimization.
Fix: Clerk Not Working — Auth Not Loading, Middleware Blocking, or User Data Missing
How to fix Clerk authentication issues — ClerkProvider setup, middleware configuration, useUser and useAuth hooks, server-side auth, webhook handling, and organization features.
Fix: cmdk Not Working — Command Palette Not Opening, Items Not Filtering, or Keyboard Navigation Broken
How to fix cmdk command palette issues — Dialog setup, custom filtering, groups and separators, keyboard shortcuts, async search, nested pages, and integration with shadcn/ui and Tailwind.
Fix: Conform Not Working — Form Validation Not Triggering, Server Errors Missing, or Zod Schema Rejected
How to fix Conform form validation issues — useForm setup with Zod, server action integration, nested and array fields, file uploads, progressive enhancement, and Remix and Next.js usage.
Fix: Docusaurus Not Working — Build Failing, Sidebar Not Showing, or Plugin Errors
How to fix Docusaurus issues — docs and blog configuration, sidebar generation, custom theme components, plugin setup, MDX compatibility, search integration, and deployment.
Fix: ElectricSQL Not Working — Sync Not Starting, Shapes Empty, or Postgres Connection Failing
How to fix ElectricSQL issues — Postgres setup with logical replication, shape definitions, real-time sync to the client, React hooks, write-path through the server, and deployment configuration.
Fix: Embla Carousel Not Working — Slides Not Scrolling, Autoplay Not Starting, or Thumbnails Not Syncing
How to fix Embla Carousel issues — React setup, slide sizing, autoplay and navigation plugins, loop mode, thumbnail carousels, responsive breakpoints, and vertical scrolling.
Fix: Fumadocs Not Working — Pages Not Found, Search Not Indexing, or MDX Components Missing
How to fix Fumadocs documentation framework issues — Next.js App Router setup, content source configuration, sidebar generation, MDX components, search, OpenAPI integration, and custom themes.
Fix: i18next Not Working — Translations Missing, Language Not Switching, or Namespace Errors
How to fix i18next issues — react-i18next setup, translation file loading, namespace configuration, language detection, interpolation, pluralization, and Next.js integration.
Fix: Lingui Not Working — Messages Not Extracted, Translations Missing, or Macro Errors
How to fix Lingui.js i18n issues — setup with React, message extraction, macro compilation, ICU format, lazy loading catalogs, and Next.js integration.
Fix: Lottie Not Working — Animation Not Playing, File Not Loading, or React Component Blank
How to fix Lottie animation issues — lottie-react and lottie-web setup, JSON animation loading, playback control, interactivity, lazy loading, and performance optimization.
Fix: Mantine Not Working — Styles Not Loading, Theme Not Applying, or Components Broken After Upgrade
How to fix Mantine UI issues — MantineProvider setup, PostCSS configuration, theme customization, dark mode, form validation with useForm, and Next.js App Router integration.
Fix: Mapbox GL JS Not Working — Map Not Rendering, Markers Missing, or Access Token Invalid
How to fix Mapbox GL JS issues — access token setup, React integration with react-map-gl, markers and popups, custom layers, geocoding, directions, and Next.js configuration.
Fix: Monaco Editor Not Working — Editor Not Loading, TypeScript Errors, or Web Workers Failing
How to fix Monaco Editor issues — React integration with @monaco-editor/react, worker setup, TypeScript IntelliSense, custom themes, multi-file editing, and Next.js configuration.
Fix: next-safe-action Not Working — Action Not Executing, Validation Errors Missing, or Type Errors
How to fix next-safe-action issues — action client setup, Zod schema validation, useAction and useOptimisticAction hooks, middleware, error handling, and authorization patterns.
Fix: Nextra Not Working — Pages Not Rendering, Sidebar Missing, or MDX Components Broken
How to fix Nextra documentation site issues — Next.js integration, _meta.json sidebar configuration, custom MDX components, search setup, theme customization, and static export.
Fix: nuqs Not Working — URL State Not Syncing, Type Errors, or Server Component Issues
How to fix nuqs URL search params state management — useQueryState and useQueryStates setup, parsers, server-side access, shallow routing, history mode, and Next.js App Router integration.
Fix: Orval Not Working — Code Generation Failing, Types Not Matching API, or Hooks Not Updating
How to fix Orval API client generation issues — OpenAPI spec configuration, custom output targets, React Query and Axios integration, mock generation, type overrides, and CI/CD automation.
Fix: PowerSync Not Working — Offline Sync Failing, Queries Returning Stale Data, or Backend Connection Errors
How to fix PowerSync issues — SQLite local database, sync rules configuration, backend connector setup, watched queries, offline-first patterns, and React and React Native integration.
Fix: Prism React Renderer Not Working — No Syntax Colors, Wrong Language, or Custom Theme Not Applying
How to fix prism-react-renderer issues — Highlight component setup, language support, custom themes, line highlighting, copy button, and integration with MDX and documentation sites.
Fix: React Aria Not Working — Components Not Rendering, ARIA Attributes Missing, or Styling Conflicts
How to fix React Aria and React Aria Components issues — hooks vs components API, styling with Tailwind CSS, custom components, collections pattern, forms, and accessibility compliance.
Fix: React PDF Not Working — PDF Not Rendering, Worker Error, or Pages Blank
How to fix react-pdf and @react-pdf/renderer issues — PDF viewer setup, worker configuration, page rendering, text selection, annotations, and generating PDFs in React.
Fix: React Three Fiber Not Working — Canvas Blank, Models Not Loading, or Performance Dropping
How to fix React Three Fiber (R3F) issues — Canvas setup, loading 3D models with useGLTF, lighting, camera controls, animations with useFrame, post-processing, and Next.js integration.
Fix: Sonner Not Working — Toasts Not Showing, Styling Broken, or Server Component Errors
How to fix Sonner toast notification issues — Toaster setup, toast types, custom styling, promise toasts, action buttons, positioning, dark mode, and Next.js App Router integration.
Fix: ts-rest Not Working — Contract Types Not Matching, Client Requests Failing, or Server Validation Errors
How to fix ts-rest issues — contract definition, type-safe client and server setup, Zod validation, Next.js App Router integration, error handling, and OpenAPI generation.
Fix: Vercel AI SDK Not Working — Streaming Not Rendering, useChat Stuck Loading, or Provider Errors
How to fix Vercel AI SDK issues — useChat and useCompletion hooks, streaming responses with streamText, provider configuration for OpenAI and Anthropic, tool calling, and Next.js integration.
Fix: Auth.js (NextAuth) Not Working — Session Null, OAuth Callback Error, or CSRF Token Mismatch
How to fix Auth.js and NextAuth.js issues — OAuth provider setup, session handling in App Router and Pages Router, JWT vs database sessions, middleware protection, and credential provider configuration.
Fix: Liveblocks Not Working — Room Not Connecting, Presence Not Syncing, or Storage Mutations Lost
How to fix Liveblocks issues — room setup, real-time presence with useOthers, conflict-free storage with useMutation, Yjs integration, authentication, and React suspense patterns.
Fix: Million.js Not Working — Compiler Errors, Components Not Optimized, or React Compatibility Issues
How to fix Million.js issues — compiler setup with Vite and Next.js, block() optimization rules, component compatibility constraints, automatic mode, and debugging performance gains.
Fix: Payload CMS Not Working — Collections Not Loading, Auth Failing, or Admin Panel Blank
How to fix Payload CMS issues — collection and global config, access control, hooks, custom fields, REST and GraphQL APIs, Next.js integration, and database adapter setup.
Fix: Radix UI Not Working — Popover Not Opening, Dialog Closing Immediately, or Styling Breaking
How to fix Radix UI issues — Popover and Dialog setup, controlled vs uncontrolled state, portal rendering, animation with CSS or Framer Motion, accessibility traps, and Tailwind CSS integration.
Fix: React Email and Resend Not Working — Emails Not Sending, Templates Not Rendering, or Styling Broken
How to fix React Email and Resend issues — email template components, inline styles, Resend API integration, preview server, attachments, and email client compatibility.
Fix: TanStack Router Not Working — Routes Not Matching, Loader Not Running, or Type Errors
How to fix TanStack Router issues — file-based routing setup, route tree generation, loader and search params, authenticated routes, type-safe navigation, and code splitting.
Fix: dnd-kit Not Working — Drag Not Starting, Sort Order Not Updating, or Items Jumping on Drop
How to fix dnd-kit issues — DndContext setup, sensors configuration, useSortable with SortableContext, drag overlays, collision detection algorithms, and accessible drag and drop.
Fix: Framer Motion Not Working — Animation Not Playing, Exit Animation Skipped, or Layout Shift on Mount
How to fix Framer Motion issues — variants, AnimatePresence for exit animations, layout animations, useMotionValue, server component errors, and performance optimization.
Fix: Jotai Not Working — Atom Not Updating, Derived Atom Out of Sync, or atomWithStorage Hydration Error
How to fix Jotai state management issues — atom scope, derived atoms, async atoms with Suspense, atomWithStorage SSR, useAtomValue vs useSetAtom, and debugging stale state.
Fix: MDX Not Working — Components Not Rendering, Imports Failing, or Frontmatter Not Parsed
How to fix MDX issues — Next.js App Router setup with @next/mdx and next-mdx-remote, custom component mapping, frontmatter parsing with gray-matter, remark and rehype plugins, and TypeScript configuration.
Fix: Recharts Not Working — Chart Not Rendering, Tooltip Missing, or ResponsiveContainer Showing Zero Height
How to fix Recharts issues — ResponsiveContainer setup, data format for each chart type, custom tooltips, axis configuration, legends, animations, and TypeScript types.
Fix: Remix Not Working — Loader Returns Undefined, Action Not Triggered, or Nested Route Data Missing
How to fix Remix issues — loader and action setup, nested route outlet, useLoaderData typing, error boundaries, defer with Await, and common React Router v7 migration problems.
Fix: shadcn/ui Not Working — Components Not Rendering, Styles Missing, or Dark Mode Broken
How to fix shadcn/ui issues — Tailwind CSS v4 vs v3 configuration, CSS variables, dark mode setup, component installation, cn() utility, and common errors after adding components.
Fix: Storybook Not Working — Addon Conflicts, Component Not Rendering, or Build Fails After Upgrade
How to fix Storybook issues — CSF3 story format, addon configuration, webpack vs Vite builder, decorator setup, args not updating component, and Storybook 8 migration problems.
Fix: styled-components Not Working — Styles Not Applying, SSR Flash of Unstyled Content, or Theme Not Available
How to fix styled-components issues — ThemeProvider setup, Next.js SSR with ServerStyleSheet, shouldForwardProp, attrs, TypeScript theme typing, and styled-components v6 migration.
Fix: TanStack Query Not Working — Data Not Fetching, Cache Not Updating, or Mutation Not Triggering Re-render
How to fix TanStack Query (React Query v5) issues — query keys, stale time, enabled flag, mutation callbacks, optimistic updates, QueryClient setup, and SSR with prefetchQuery.
Fix: TanStack Table Not Working — Sorting Not Triggering, Filters Ignored, or Pagination Showing Wrong Data
How to fix TanStack Table (React Table v8) issues — column definitions, server-side sorting and filtering, row selection, virtual rows with TanStack Virtual, and v7 to v8 migration errors.
Fix: Tiptap Not Working — Editor Not Rendering, Extensions Missing, or Content Not Saving
How to fix Tiptap editor issues — useEditor setup in React, StarterKit configuration, custom nodes and marks, SSR with Next.js, collaborative editing, and content serialization.
Fix: Valtio Not Working — Component Not Re-rendering, Snapshot Stale, or Proxy Mutation Not Tracked
How to fix Valtio state management issues — proxy vs snapshot, useSnapshot for React, subscribe for side effects, derived state with computed, async actions, and Valtio with React Server Components.
Fix: Zustand Not Working — Component Not Re-rendering, State Reset on Refresh, or Selector Causing Infinite Loop
How to fix Zustand state management issues — selector optimization, persist middleware, shallow comparison, devtools setup, slice pattern for large stores, and common subscription mistakes.
Fix: NextAuth.js Not Working — Session Null, Callback Errors, or OAuth Redirect Issues
How to fix NextAuth.js (Auth.js) issues — session undefined in server components, OAuth callback URL mismatch, JWT vs database sessions, middleware protection, and credentials provider.
Fix: React Hook Form Not Working — register Not Applying, Validation Not Triggering, or Controller Issues
How to fix React Hook Form issues — register spread syntax, Controller for UI libraries, validation modes, watch vs getValues, nested fields, and form submission errors.
Fix: React useTransition Not Working — UI Still Freezes, isPending Never True, or Transition Not Deferred
How to fix React useTransition and startTransition issues — what counts as a transition, Suspense integration, concurrent rendering requirements, and common mistakes that prevent transitions from deferring.
Fix: Next.js Server Action Not Working — Action Not Called or Returns Error
How to fix Next.js Server Actions — use server directive, form binding, revalidation, error handling, middleware conflicts, and client component limitations.
Fix: React Testing Library Not Finding Element — Unable to Find Role or Text
How to fix React Testing Library query failures — getByRole vs getByText, async queries, accessible names, waitFor patterns, custom queries, and common selector mistakes.
Fix: React forwardRef Not Working — ref is null or Component Not Exposing Methods
How to fix React forwardRef issues — ref null on custom components, useImperativeHandle setup, forwardRef with TypeScript, class components, and React 19 ref as prop changes.
Fix: React Portal Event Bubbling Not Working — Events Not Reaching Parent
How to fix React Portal event bubbling — understanding Portal event propagation, modal close on outside click, stopPropagation side effects, focus management, and accessibility.
Fix: React StrictMode Double Render — Side Effects Running Twice in Development
How to fix React StrictMode double render issues — understanding intentional double invocation, fixing side effects, useEffect cleanup, external subscriptions, and production behavior.
Fix: React Suspense Not Working — Boundary Not Catching or Fallback Not Showing
How to fix React Suspense boundaries not triggering — lazy() import syntax, use() hook, data fetching libraries, ErrorBoundary vs Suspense, and Next.js loading.tsx.
Fix: React Hydration Error — Text Content Does Not Match
How to fix React hydration errors — server/client HTML mismatches, useEffect for client-only code, suppressHydrationWarning, dynamic content, and Next.js specific hydration issues.
Fix: TanStack Query (React Query) Returning Stale Data — Cache Not Updating
How to fix TanStack Query returning stale cached data — staleTime, invalidateQueries, query key structure, optimistic updates, and cache synchronization after mutations.
Fix: React Server Components Error — useState, Event Handlers, and Client Boundary Issues
How to fix React Server Components errors — useState and hooks in server components, missing 'use client' directive, async component patterns, serialization errors, and client/server boundary mistakes.
Fix: Redux State Not Updating — Component Not Re-rendering
How to fix Redux state not updating in components — mutating state directly, stale selectors, missing immer patterns in Redux Toolkit, useSelector mistakes, and debugging with Redux DevTools.
Fix: React useEffect Runs Twice in Development
Why React useEffect runs twice in development with Strict Mode, how to handle the double invocation correctly, when to add cleanup functions, and when the double-run actually reveals a real bug.
Fix: React Query (TanStack Query) Infinite Refetching Loop
How to fix React Query refetching infinitely — why useQuery keeps fetching, how object and array dependencies cause loops, how to stabilize queryKey, and configure refetch behavior correctly.
Fix: React.memo Not Preventing Re-renders
How to fix React.memo not working — components still re-rendering despite being wrapped in memo, caused by new object/function references, missing useCallback, and incorrect comparison functions.
Fix: React.lazy and Suspense Errors (Element Type Invalid, Loading Chunk Failed)
How to fix React.lazy and Suspense errors — Element type is invalid, A React component suspended while rendering, Loading chunk failed, and lazy import mistakes with named vs default exports.
Fix: Webpack HMR (Hot Module Replacement) Not Working
How to fix Webpack Hot Module Replacement not updating the browser — HMR connection lost, full page reloads instead of hot updates, and HMR breaking in Docker or behind a proxy.
Fix: React Context Not Updating / Re-rendering Components
How to fix React Context not triggering re-renders — caused by mutating state directly, wrong provider placement, stale closures, and missing value changes that React can detect.
Fix: No Routes Matched Location in React Router v6
How to fix 'No routes matched location' in React Router v6 — caused by missing Routes wrapper, wrong path syntax, nested route mismatches, and v5 to v6 migration issues.
Fix: React Warning: Failed prop type
How to fix the React 'Warning: Failed prop type' error. Covers wrong prop types, missing required props, children type issues, shape and oneOf PropTypes, migrating to TypeScript, default props, and third-party component mismatches.
Fix: Next.js 500 Internal Server Error
How to fix the Next.js 500 Internal Server Error by checking server logs, fixing getServerSideProps, API routes, environment variables, database connections, middleware, and deployment issues.
Fix: Next.js Module not found: Can't resolve 'fs' (or 'path', 'crypto', 'net')
How to fix Next.js Module not found Can't resolve fs error caused by importing Node.js modules in client components, wrong server/client boundaries, and missing polyfills.
Fix: React TypeError: Cannot read property 'map' of undefined
How to fix React TypeError Cannot read property map of undefined caused by uninitialized state, async data loading, wrong API response structure, and missing default values.
Fix: React Cannot update a component while rendering a different component
How to fix React Cannot update a component while rendering a different component caused by setState during render, context updates in render, and Redux dispatch in render.
Fix: React Warning: Each child in a list should have a unique "key" prop
How to fix the React unique key prop warning caused by missing keys in lists, duplicate keys, index keys, nested maps, and dynamic list rendering issues.
Fix: Invalid hook call. Hooks can only be called inside of the body of a function component
How to fix the React Invalid hook call error caused by mismatched React versions, duplicate React copies, calling hooks outside components, and class component usage.
Fix: Objects are not valid as a React child (found: [object Object])
How to fix the React error 'Objects are not valid as a React child' caused by rendering plain objects, Date objects, Promises, or API responses directly in JSX.
Fix: React Hook useEffect has a missing dependency warning
How to fix the React Hook useEffect has a missing dependency warning — covers the exhaustive-deps rule, useCallback, useMemo, refs, proper fetch patterns, and when to safely suppress the lint warning.
Fix: React useState not updating (state not changing after setState)
How to fix React useState not updating. Covers async state updates, functional updates, object mutations, stale closures, setTimeout issues, React 18 batching, props initialization, and debugging state changes.
Fix: Next.js Image Optimization Errors – Invalid src, Missing Loader, or Unoptimized
How to fix Next.js Image component errors including 'Invalid src prop', 'hostname not configured', missing loader, and optimization failures in production.
Fix: React Can't Perform a State Update on an Unmounted Component
How to fix the React warning 'Can't perform a React state update on an unmounted component' caused by async operations, subscriptions, or timers.
Fix: React useEffect runs infinitely (infinite loop / maximum update depth exceeded)
How to fix useEffect infinite loops in React — covers missing dependency arrays, referential equality, useCallback, unconditional setState, data fetching cleanup, event listeners, useRef, previous value comparison, and the exhaustive-deps lint rule.
Fix: Hydration failed because the initial UI does not match what was rendered on the server (Next.js)
How to fix the Next.js hydration mismatch error. Covers invalid HTML nesting, browser extensions, Date/time differences, useEffect for client-only code, dynamic imports, suppressHydrationWarning, localStorage, third-party scripts, Math.random, auth state, and React portals.
Fix: TS2322 Type 'X' is not assignable to type 'Y'
How to fix TypeScript error TS2322 'Type is not assignable to type'. Covers literal types vs general types, string vs String, union types, interface compatibility, generic constraints, readonly arrays, excess property checking, discriminated unions, type assertions, type widening and narrowing, React event handlers, Promise return types, and enum mismatches.
Fix: Loading chunk failed / ChunkLoadError
How to fix 'Loading chunk failed', 'ChunkLoadError', and 'Failed to fetch dynamically imported module' in webpack, Next.js, React, and Vite. Covers stale deployments, CDN caching, publicPath misconfiguration, service worker cache, code splitting, dynamic import retry strategies, React.lazy error boundaries, and Next.js-specific solutions.
Fix: TS2532 Object is possibly 'undefined' / Object is possibly 'null'
How to fix TypeScript errors TS2532 'Object is possibly undefined', TS18048 'Object is possibly undefined', and 'Object is possibly null'. Covers optional chaining, nullish coalescing, type narrowing, non-null assertion, type guards, strictNullChecks, Array.find, Map.get, React useRef, and more.
Fix: Too many re-renders. React limits the number of renders to prevent an infinite loop.
How to fix 'Too many re-renders' in React. Covers calling functions in JSX instead of passing references, setState in the render body, useEffect infinite loops, object/array dependency issues, and how to debug re-renders with React DevTools.
Fix: Module not found: Can't resolve / Cannot find module or its corresponding type declarations
How to fix 'Module not found: Can't resolve' in webpack, Vite, and React, and 'Cannot find module or its corresponding type declarations' in TypeScript. Covers missing packages, wrong import paths, case sensitivity, path aliases, node_modules corruption, monorepo hoisting, barrel files, and asset imports.
Fix: [vite] Internal server error: Failed to resolve import
How to fix Vite's 'Failed to resolve import' error, including 'Does the file exist?', 'Optimized dependency needs to be force included', 'Pre-transform error', and '504 (Outdated Optimize Dep)'. Covers missing packages, path aliases, optimizeDeps, cache clearing, and CJS/monorepo edge cases.
Fix: React Hook "useXxx" is called conditionally. React Hooks must be called in the exact same order in every component render.
How to fix 'React Hook is called conditionally', 'Rendered more hooks than during the previous render', 'Invalid hook call', and other React Hooks order errors. Covers conditional hooks, hooks in loops, hooks after early returns, duplicate React versions, and ESLint setup.
Fix: process.env.VARIABLE_NAME Is Undefined (Node.js, React, Next.js, Vite)
How to fix 'process.env.VARIABLE_NAME is undefined' and environment variables not loading from .env files in Node.js, React, Next.js, Vite, and Docker.
Fix: Port 3000 Is Already in Use (EADDRINUSE)
How to fix 'port 3000 is already in use', 'EADDRINUSE', and 'address already in use :::3000' errors in Node.js, React, Next.js, and other frameworks on macOS, Linux, and Windows.
Fix: TypeError: Cannot read properties of undefined (reading 'xxx')
How to fix 'TypeError: Cannot read properties of undefined', 'Cannot read property of undefined', and 'Cannot read properties of null' in JavaScript, TypeScript, and React. Covers optional chaining, async data fetching, destructuring, and nested object access.
Fix: Access to fetch has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header
How to fix 'Access to fetch at ... from origin ... has been blocked by CORS policy: No Access-Control-Allow-Origin header is present on the requested resource' in JavaScript. Covers Express, Django, Flask, Spring Boot, ASP.NET, nginx, Apache, dev proxies, preflight requests, credentials, and edge cases.
Next.js (39)
Fix: next-themes Not Working — Hydration Mismatch, Tailwind Dark Mode, FOUC, and System Preference
How to fix next-themes errors — hydration mismatch on mount, FOUC flash before theme applies, Tailwind dark: classes not switching, ThemeProvider in App Router, defaultTheme system not respected, and TypeScript types.
Fix: React 19 Actions Not Working — useActionState, useFormStatus, useOptimistic, and form action
How to fix React 19 actions errors — useActionState signature, form action vs onSubmit, useFormStatus must be in child, useOptimistic state desync, Server Actions in client components, and error handling.
Fix: Sentry Source Maps Not Working — Release Matching, sentry-cli Upload, Vite/Webpack Plugins
How to fix Sentry source maps errors — minified stack traces, release name mismatch between build and runtime, sentry-cli upload-sourcemaps options, Vite/Webpack/Next.js plugin setup, and hiding maps from public.
Fix: Vercel Blob Not Working — put/get/del, handleUpload Browser Flow, Access Modes, and Multipart
How to fix Vercel Blob errors — BLOB_READ_WRITE_TOKEN missing, put vs handleUpload for browser, public vs private access, multipart upload for large files, expires/signed URLs, list/cursor pagination, and overwriting URLs.
Fix: Vercel Edge Function Not Working — Runtime APIs, Bundle Size, DB Drivers, and Middleware
How to fix Vercel Edge Function errors — Node.js APIs not available in Edge Runtime, 1MB bundle size limit, Postgres/MySQL drivers incompatible, streaming responses, geo headers, and Middleware vs Edge API Route.
Fix: Next.js 'params should be awaited before using its properties'
How to fix Next.js 15 async params and searchParams errors — await in Server Components, React.use in Client Components, generateMetadata, generateStaticParams, and the codemod migration path.
Fix: React Compiler Not Working — ESLint Plugin, Babel Setup, Bail-Outs, and Vite/Next.js Config
How to fix React Compiler issues — eslint-plugin-react-compiler not flagging, babel-plugin-react-compiler not running, 'Function contains a code construct that prevents compilation', Next.js 15 config, and removing useMemo/useCallback safely.
Fix: SWR Not Working — Key Changes, Mutate Not Updating, Conditional Fetching, and SSR Hydration
How to fix SWR errors — useSWR not refetching on key change, mutate not invalidating, conditional null key, fallbackData vs fallback, SSR hydration mismatch, infinite scroll pagination, and TypeScript typing.
Fix: Algolia Not Working — Search Returning No Results, Index Not Updating, or InstantSearch Errors
How to fix Algolia issues — indexing, search queries, InstantSearch setup, ranking configuration, facets, API key permissions, and Next.js integration.
Fix: Chakra UI Not Working — Provider Missing, Styles Not Applied, or Dark Mode Broken
How to fix Chakra UI v3 issues — ChakraProvider setup, color mode, theming, server-side rendering in Next.js, component styling, and common runtime errors.
Fix: Sanity Not Working — GROQ Queries Returning Nothing, CORS Errors, or Studio Not Loading
How to fix Sanity CMS issues — GROQ queries, CORS configuration, dataset permissions, image URLs, Portable Text, webhooks, and Next.js integration.
Fix: UploadThing Not Working — File Upload Failing, CORS Errors, or Route Not Found
How to fix UploadThing issues — file router configuration, Next.js App Router and Pages Router setup, CORS, file type restrictions, progress callbacks, and deployment.
Fix: Clerk Not Working — Auth Not Loading, Middleware Blocking, or User Data Missing
How to fix Clerk authentication issues — ClerkProvider setup, middleware configuration, useUser and useAuth hooks, server-side auth, webhook handling, and organization features.
Fix: Contentlayer Not Working — Content Not Generated, Types Missing, or Build Errors
How to fix Contentlayer and Contentlayer2 issues — content source configuration, document type definitions, MDX processing, computed fields, Next.js integration, and migration to alternatives.
Fix: Fumadocs Not Working — Pages Not Found, Search Not Indexing, or MDX Components Missing
How to fix Fumadocs documentation framework issues — Next.js App Router setup, content source configuration, sidebar generation, MDX components, search, OpenAPI integration, and custom themes.
Fix: next-safe-action Not Working — Action Not Executing, Validation Errors Missing, or Type Errors
How to fix next-safe-action issues — action client setup, Zod schema validation, useAction and useOptimisticAction hooks, middleware, error handling, and authorization patterns.
Fix: Nextra Not Working — Pages Not Rendering, Sidebar Missing, or MDX Components Broken
How to fix Nextra documentation site issues — Next.js integration, _meta.json sidebar configuration, custom MDX components, search setup, theme customization, and static export.
Fix: nuqs Not Working — URL State Not Syncing, Type Errors, or Server Component Issues
How to fix nuqs URL search params state management — useQueryState and useQueryStates setup, parsers, server-side access, shallow routing, history mode, and Next.js App Router integration.
Fix: Vercel AI SDK Not Working — Streaming Not Rendering, useChat Stuck Loading, or Provider Errors
How to fix Vercel AI SDK issues — useChat and useCompletion hooks, streaming responses with streamText, provider configuration for OpenAI and Anthropic, tool calling, and Next.js integration.
Fix: NextAuth.js Not Working — Session Null, Callback Errors, or OAuth Redirect Issues
How to fix NextAuth.js (Auth.js) issues — session undefined in server components, OAuth callback URL mismatch, JWT vs database sessions, middleware protection, and credentials provider.
Fix: Next.js Server Action Not Working — Action Not Called or Returns Error
How to fix Next.js Server Actions — use server directive, form binding, revalidation, error handling, middleware conflicts, and client component limitations.
Fix: Next.js Font Not Loading — Custom Fonts Not Applying or Flashing
How to fix Next.js font loading issues — next/font/google setup, CSS variable approach, local fonts, font-display settings, FOUT flash, and Tailwind CSS font integration.
Fix: React Hydration Error — Text Content Does Not Match
How to fix React hydration errors — server/client HTML mismatches, useEffect for client-only code, suppressHydrationWarning, dynamic content, and Next.js specific hydration issues.
Fix: Next.js App Router Fetch Not Caching or Always Stale
How to fix Next.js App Router fetch caching issues — understanding cache behavior, revalidation with next.revalidate, opting out with no-store, cache tags, and debugging stale data.
Fix: React Server Components Error — useState, Event Handlers, and Client Boundary Issues
How to fix React Server Components errors — useState and hooks in server components, missing 'use client' directive, async component patterns, serialization errors, and client/server boundary mistakes.
Fix: Next.js CORS Error on API Routes
How to fix CORS errors in Next.js API routes — adding Access-Control headers, handling preflight OPTIONS requests, configuring next.config.js headers, and avoiding common proxy mistakes.
Fix: Next.js Middleware Not Running (middleware.ts Not Intercepting Requests)
How to fix Next.js middleware not executing — wrong file location, matcher config errors, middleware not intercepting API routes, and how to debug middleware execution in Next.js 13 and 14.
Fix: Next.js Build Failed (next build Errors and How to Fix Them)
How to fix Next.js build failures — TypeScript errors blocking production builds, module resolution failures, missing environment variables, static generation errors, and common next build crash causes.
Fix: Next.js Environment Variables Returning undefined
How to fix Next.js environment variables returning undefined — NEXT_PUBLIC prefix rules, server vs client context, .env file loading order, and runtime vs build-time variable access.
Fix: Next.js 500 Internal Server Error
How to fix the Next.js 500 Internal Server Error by checking server logs, fixing getServerSideProps, API routes, environment variables, database connections, middleware, and deployment issues.
Fix: Next.js API route 404 Not Found or not responding
How to fix Next.js API route 404 not found errors caused by wrong file paths, App Router vs Pages Router confusion, incorrect exports, and deployment issues.
Fix: Next.js Module not found: Can't resolve 'fs' (or 'path', 'crypto', 'net')
How to fix Next.js Module not found Can't resolve fs error caused by importing Node.js modules in client components, wrong server/client boundaries, and missing polyfills.
Fix: Next.js Image Optimization Errors – Invalid src, Missing Loader, or Unoptimized
How to fix Next.js Image component errors including 'Invalid src prop', 'hostname not configured', missing loader, and optimization failures in production.
Fix: React useEffect runs infinitely (infinite loop / maximum update depth exceeded)
How to fix useEffect infinite loops in React — covers missing dependency arrays, referential equality, useCallback, unconditional setState, data fetching cleanup, event listeners, useRef, previous value comparison, and the exhaustive-deps lint rule.
Fix: Hydration failed because the initial UI does not match what was rendered on the server (Next.js)
How to fix the Next.js hydration mismatch error. Covers invalid HTML nesting, browser extensions, Date/time differences, useEffect for client-only code, dynamic imports, suppressHydrationWarning, localStorage, third-party scripts, Math.random, auth state, and React portals.
Fix: Loading chunk failed / ChunkLoadError
How to fix 'Loading chunk failed', 'ChunkLoadError', and 'Failed to fetch dynamically imported module' in webpack, Next.js, React, and Vite. Covers stale deployments, CDN caching, publicPath misconfiguration, service worker cache, code splitting, dynamic import retry strategies, React.lazy error boundaries, and Next.js-specific solutions.
Fix: ERR_CONNECTION_REFUSED (localhost refused to connect)
How to fix 'ERR_CONNECTION_REFUSED', 'localhost refused to connect', and 'This site can't be reached' errors when accessing localhost in Chrome, Firefox, and Edge. Covers dev servers, port issues, 0.0.0.0 vs 127.0.0.1, Docker port mapping, WSL2, firewalls, and more.
Fix: process.env.VARIABLE_NAME Is Undefined (Node.js, React, Next.js, Vite)
How to fix 'process.env.VARIABLE_NAME is undefined' and environment variables not loading from .env files in Node.js, React, Next.js, Vite, and Docker.
Fix: Port 3000 Is Already in Use (EADDRINUSE)
How to fix 'port 3000 is already in use', 'EADDRINUSE', and 'address already in use :::3000' errors in Node.js, React, Next.js, and other frameworks on macOS, Linux, and Windows.
Vue / Svelte / Angular (33)
Fix: Inertia.js Not Working — Shared Data, Lazy Props, Versioning, Forms, and SSR
How to fix Inertia.js errors — Inertia.render not returning a component, shared data missing on every page, lazy props not deferring, asset versioning forcing reloads, useForm helper, and SSR setup.
Fix: Playwright Component Testing Not Working — Mount Fixture, Vite Config, Styles, and TypeScript
How to fix Playwright component testing errors — playwright-ct.config not found, mount fixture undefined, CSS not loaded in tests, Vite alias for imports, TypeScript paths, hooks (beforeMount), and snapshot strategy.
Fix: Analog Not Working — Routes Not Loading, API Endpoints Failing, or Vite Build Errors
How to fix Analog (Angular meta-framework) issues — file-based routing, API routes with Nitro, content collections, server-side rendering, markdown pages, and deployment.
Fix: Angular SSR Not Working — Hydration Failing, Window Not Defined, or Build Errors
How to fix Angular Server-Side Rendering issues — @angular/ssr setup, hydration, platform detection, transfer state, route-level rendering, and deployment configuration.
Fix: Paraglide Not Working — Messages Not Loading, Compiler Errors, or Framework Integration Issues
How to fix Paraglide.js i18n issues — message compilation, type-safe translations, SvelteKit and Next.js integration, language switching, and message extraction from existing code.
Fix: Svelte 5 Runes Not Working — $state Not Reactive, $derived Not Updating, or $effect Running Twice
How to fix Svelte 5 Runes issues — $state and $state.raw reactivity, $derived computations, $effect lifecycle, $props and $bindable, migration from Svelte 4 stores, and component patterns.
Fix: Nuxt Not Working — useFetch Returns Undefined, Server Route 404, or Hydration Mismatch
How to fix Nuxt 3 issues — useFetch vs $fetch, server routes in server/api, composable SSR rules, useAsyncData, hydration errors, and Nitro configuration problems.
Fix: RxJS Not Working — Observable Not Emitting, Memory Leak from Unsubscribed Stream, or Operator Behaving Unexpectedly
How to fix RxJS issues — subscription management, switchMap vs mergeMap vs concatMap, error handling with catchError, Subject types, cold vs hot observables, and Angular async pipe.
Fix: SvelteKit Not Working — load Function Errors, Form Actions Failing, or SSR Data Not Available
How to fix SvelteKit issues — load function data flow, +page.server.ts vs +page.ts, form actions with use:enhance, hooks.server.ts, SSR vs CSR mode, and common routing mistakes.
Fix: Angular Pipe Not Working — Custom Pipe Not Transforming or async Pipe Not Rendering
How to fix Angular pipe issues — declaring pipes in modules, standalone pipe imports, pure vs impure pipes, async pipe with observables, pipe chaining, and custom pipe debugging.
Fix: Pinia Store Not Working — State Not Reactive, Actions Not Updating, or Store Not Found
How to fix Pinia store issues — state reactivity with storeToRefs, getters not updating, actions async patterns, store outside components, SSR hydration, and testing Pinia stores.
Fix: Vue Router Params Not Updating — Component Not Re-rendering or beforeRouteUpdate Not Firing
How to fix Vue Router params not updating when navigating between same-route paths — watch $route, beforeRouteUpdate, onBeforeRouteUpdate, and component reuse behavior explained.
Fix: Vue Slot Not Working — Named Slots Not Rendering or Scoped Slot Data Not Accessible
How to fix Vue 3 slot issues — v-slot syntax, named slots, scoped slots passing data, default slot content, fallback content, and dynamic slot names.
Fix: Vue Teleport Not Rendering — Content Not Appearing at Target Element
How to fix Vue Teleport not working — target element not found, SSR with Teleport, disabled prop, multiple Teleports to the same target, and timing issues.
Fix: Angular HTTP Interceptor Not Working — Requests Not Intercepted
How to fix Angular HTTP interceptors not triggering — provideHttpClient setup, functional interceptors, order of interceptors, excluding specific URLs, and error handling.
Fix: Angular Signals Not Updating — computed() and effect() Not Triggering
How to fix Angular Signals not updating — signal mutations, computed dependency tracking, effect() cleanup, toSignal() with Observables, and migrating from zone-based change detection.
Fix: Angular Standalone Component Error — Component is Not a Known Element
How to fix Angular standalone component errors — imports array, NgModule migration, RouterModule vs RouterLink, CommonModule replacement, and mixing standalone with module-based components.
Fix: Svelte Store Subscription Leak — Memory Leak from Unsubscribed Stores
How to fix Svelte store subscription memory leaks — auto-subscription with $, manual unsubscribe, derived store cleanup, custom store lifecycle, and SvelteKit SSR store handling.
Fix: Vue Composable Not Reactive — ref and reactive Losing Reactivity After Destructuring
How to fix Vue composable reactivity loss — toRefs for destructuring, returning refs vs raw values, reactive object pitfalls, stale closures, and composable design patterns.
Fix: Vue Composition API Reactivity Lost — Destructured Props or Reactive Object Not Updating
How to fix Vue Composition API reactivity loss — destructuring reactive objects, toRefs, storeToRefs, ref vs reactive, watch vs watchEffect, and template not updating.
Fix: Pinia State Not Reactive — Store Changes Not Updating the Component
How to fix Pinia store state not updating components — storeToRefs for destructuring, $patch for partial updates, avoiding reactive() wrapping, getters vs computed, and SSR hydration.
Fix: Vue Router 404 on Page Refresh — History Mode Returns 404 or Blank Page
How to fix Vue Router 404 errors on page refresh in history mode — server configuration for nginx, Apache, Vite, Express, and Netlify, plus hash mode as a fallback.
Fix: Angular Form Validation Not Working — Validators Not Triggering
How to fix Angular form validation not working — Reactive Forms vs Template-Driven, custom validators, async validators, touched/dirty state, and error message display.
Fix: Angular Lazy Loading Not Working — Routes Not Code-Split
How to fix Angular lazy loading not working — loadChildren syntax, standalone components, route configuration mistakes, preloading strategies, and debugging bundle splits.
Fix: Angular RxJS Memory Leak — Subscriptions Not Unsubscribed
How to fix RxJS memory leaks in Angular — unsubscribing from Observables, takeUntilDestroyed, async pipe, subscription management patterns, and detecting leaks with Chrome DevTools.
Fix: Vue Computed Property Not Updating — Reactivity Not Triggered
How to fix Vue computed properties not updating — reactive dependency tracking, accessing nested objects, computed setters, watchEffect vs computed, and Vue 3 reactivity pitfalls.
Fix: Vue v-model Not Working on Custom Components — Prop Not Syncing
How to fix Vue v-model on custom components — defineModel, modelValue/update:modelValue pattern, multiple v-model bindings, v-model modifiers, and Vue 2 vs Vue 3 differences.
Fix: Angular Change Detection Not Working — View Not Updating
How to fix Angular change detection issues — OnPush strategy not triggering, async pipe, markForCheck vs detectChanges, zone.js and zoneless patterns, and manual change detection triggers.
Fix: Svelte Store Not Updating — Reactive Store Issues
How to fix Svelte store not updating the UI — writable vs readable stores, derived stores, subscribe pattern, store mutation vs assignment, and custom store patterns.
Fix: Vue Router Navigation Guard Not Working — beforeEach and Route Guards
How to fix Vue Router navigation guards not working — beforeEach, beforeEnter, in-component guards, async guards, redirect loops, and route meta authentication patterns.
Fix: Vue 3 Reactive Data Not Updating (ref/reactive Not Triggering Re-render)
How to fix Vue 3 reactive data not updating the UI — why ref and reactive lose reactivity, how to correctly mutate reactive state, and common pitfalls with destructuring and nested objects.
Fix: Angular ExpressionChangedAfterItHasBeenCheckedError
How to fix ExpressionChangedAfterItHasBeenCheckedError in Angular caused by change detection timing issues, lifecycle hooks, async pipes, and parent-child data flow.
Fix: Angular NullInjectorError: No provider for X
How to fix Angular NullInjectorError No provider for service caused by missing providers, wrong module imports, standalone components, and lazy-loaded module issues.
CSS & Layout (22)
Fix: next-themes Not Working — Hydration Mismatch, Tailwind Dark Mode, FOUC, and System Preference
How to fix next-themes errors — hydration mismatch on mount, FOUC flash before theme applies, Tailwind dark: classes not switching, ThemeProvider in App Router, defaultTheme system not respected, and TypeScript types.
Fix: Tailwind v4 Not Working — @theme, CSS-First Config, PostCSS vs Vite, and v3 Migration
How to fix Tailwind CSS v4 errors — tailwind.config.js ignored, @import 'tailwindcss' not loading, @theme custom values not applied, content scanning misses files, Vite plugin setup, and v3 to v4 migration gotchas.
Fix: NativeWind Not Working — Styles Not Applying, Dark Mode Broken, or Metro Bundler Errors
How to fix NativeWind issues — Tailwind CSS for React Native setup, Metro bundler configuration, className prop, dark mode, responsive styles, and Expo integration.
Fix: Tamagui Not Working — Styles Not Applying, Compiler Errors, or Web/Native Mismatch
How to fix Tamagui UI kit issues — setup with Expo, theme tokens, styled components, animations, responsive props, media queries, and cross-platform rendering.
Fix: Mantine Not Working — Styles Not Loading, Theme Not Applying, or Components Broken After Upgrade
How to fix Mantine UI issues — MantineProvider setup, PostCSS configuration, theme customization, dark mode, form validation with useForm, and Next.js App Router integration.
Fix: View Transitions API Not Working — No Animation Between Pages, Cross-Document Transitions Failing, or Fallback Missing
How to fix View Transitions API issues — same-document transitions, cross-document MPA transitions, view-transition-name CSS, Next.js and Astro integration, custom animations, and browser support.
Fix: Panda CSS Not Working — Styles Not Applying, Tokens Not Resolving, or Build Errors
How to fix Panda CSS issues — PostCSS setup, panda.config.ts token system, recipe and pattern definitions, conditional styles, responsive design, and integration with Next.js and Vite.
Fix: UnoCSS Not Working — Classes Not Generating, Presets Missing, or Attributify Mode Broken
How to fix UnoCSS issues — Vite plugin setup, preset configuration, attributify mode, icons preset, shortcuts, custom rules, and integration with Next.js, Nuxt, and Astro.
Fix: Vanilla Extract Not Working — Styles Not Applied, TypeScript Errors, or Build Failing
How to fix Vanilla Extract issues — .css.ts file setup, style and recipe APIs, sprinkles for utility classes, theme tokens, dynamic styles, and integration with Next.js, Vite, and Remix.
Fix: CSS Scroll Behavior Not Working — smooth scroll, scroll-snap, or scroll-margin Ignored
How to fix CSS scroll issues — scroll-behavior: smooth not working, scroll-snap alignment problems, overflow container conflicts, scroll-margin for fixed headers, and browser compatibility.
Fix: CSS Grid Layout Not Working — Items Not Placing or Spanning Correctly
How to fix CSS Grid issues — implicit vs explicit grid, grid-template-areas, auto-placement, subgrid, alignment, and common mistakes with grid-column and grid-row.
Fix: Tailwind CSS Classes Not Applying — Styles Missing in Production or Development
How to fix Tailwind CSS not applying styles — content config paths, JIT mode, dynamic class names, PostCSS setup, CDN vs build tool, and purging issues.
Fix: Next.js Font Not Loading — Custom Fonts Not Applying or Flashing
How to fix Next.js font loading issues — next/font/google setup, CSS variable approach, local fonts, font-display settings, FOUT flash, and Tailwind CSS font integration.
Fix: CSS Container Query Not Working — @container and container-type Issues
How to fix CSS container queries not working — setting container-type correctly, understanding containment scope, fixing @container syntax, and handling browser support and specificity issues.
Fix: CSS Custom Properties (Variables) Not Working or Not Updating
How to fix CSS custom properties not applying — wrong scope, missing fallback values, JavaScript not setting variables on the right element, and how CSS variables interact with media queries and Shadow DOM.
Fix: CSS Animation Not Working (@keyframes Has No Effect)
How to fix CSS animations not working — @keyframes not applying, animation paused, transform conflicts, reduced motion settings, and common animation property mistakes.
Fix: CSS position: sticky Not Working
How to fix CSS position sticky not working — element scrolls away instead of sticking, caused by overflow hidden on a parent, missing top value, wrong stacking context, or incorrect height on the container.
Fix: CSS Grid Not Working (display: grid Has No Effect)
How to fix CSS Grid not working — grid-template-columns has no effect, grid items not placing correctly, implicit vs explicit grid confusion, and common grid layout debugging techniques.
Fix: CSS Flexbox Not Working (display: flex Has No Effect)
How to fix CSS Flexbox not working — why display flex has no effect, flex children not aligning, flex-grow not stretching, and how to debug common Flexbox layout issues.
Fix: Sass Error - Undefined Variable
Fix the Sass undefined variable error caused by @use vs @import migration, variable scope issues, and dart-sass namespace changes with clear solutions.
Fix: Tailwind CSS Classes Not Applying
How to fix Tailwind CSS classes not applying to your HTML elements. Covers content config paths, purge and safelist, class conflicts and specificity, dynamic class names, PostCSS config, @apply issues, dark mode config, and JIT mode problems.
Fix: CSS z-index Not Working
How to fix z-index not working in CSS. Covers stacking contexts, position property requirement, parent stacking context limits, opacity and transform creating new stacking contexts, flexbox and grid z-index, and the isolation property.
More in this category (44)
Fix: Astro Content Collections Not Working — Content Layer, Loaders, Schema, and References
How to fix Astro content collections errors — content/config.ts moved to content.config.ts, glob loader patterns, schema validation, references between collections, live reload on add/remove, and remote loaders.
Fix: Astro Server Islands Not Working — server:defer, Fallback, Cookies, Caching, and Hydration
How to fix Astro 5 server islands — server:defer directive ignored, fallback slot missing, cookies/headers in deferred component, output config mismatch, dynamic island fetch URL, and caching the static shell.
Fix: Astro DB Not Working — Tables Not Found, Queries Failing, or Seed Data Missing
How to fix Astro DB issues — schema definition, seed data, queries with drizzle, local development, remote database sync, and Astro Studio integration.
Fix: Astro Actions Not Working — Form Submission Failing, Validation Errors Missing, or Return Type Wrong
How to fix Astro Actions issues — action definition, Zod validation, form handling, progressive enhancement, error handling, file uploads, and calling actions from client scripts.
Fix: SolidStart Not Working — Routes Not Rendering, Server Functions Failing, or Hydration Errors
How to fix SolidStart issues — file-based routing, server functions, createAsync data loading, middleware, sessions, and deployment configuration.
Fix: CodeMirror Not Working — Editor Not Rendering, Extensions Not Loading, or React State Out of Sync
How to fix CodeMirror 6 issues — basic setup, language and theme extensions, React integration, vim mode, collaborative editing, custom keybindings, and read-only mode.
Fix: gql.tada Not Working — Types Not Inferred, Schema Not Found, or IDE Not Showing Completions
How to fix gql.tada issues — schema introspection, type-safe GraphQL queries, fragment masking, urql and Apollo Client integration, IDE setup, and CI type checking.
Fix: GSAP Not Working — Animations Not Playing, ScrollTrigger Not Firing, or React Cleanup Issues
How to fix GSAP animation issues — timeline and tween basics, ScrollTrigger setup, React useGSAP hook, cleanup and context, SplitText, stagger animations, and Next.js integration.
Fix: ky Not Working — Requests Failing, Hooks Not Firing, or Retry Not Working
How to fix ky HTTP client issues — instance creation, hooks (beforeRequest, afterResponse), retry configuration, timeout handling, JSON parsing, error handling, and migration from fetch or axios.
Fix: pdf-lib Not Working — PDF Not Generating, Fonts Not Embedding, or Pages Blank
How to fix pdf-lib issues — creating PDFs from scratch, modifying existing PDFs, embedding fonts and images, form filling, merging documents, and browser and Node.js usage.
Fix: Pusher Not Working — Events Not Received, Channel Auth Failing, or Connection Dropping
How to fix Pusher real-time issues — client and server setup, channel types, presence channels, authentication endpoints, event binding, connection management, and React integration.
Fix: Starlight Not Working — Pages Not Rendering, Sidebar Wrong, or Custom Components Broken
How to fix Astro Starlight documentation site issues — configuration, sidebar ordering, custom components, overrides, i18n, search, and content collections.
Fix: Qwik Not Working — Components Not Rendering, useSignal Not Reactive, or Serialization Errors
How to fix Qwik issues — component$ boundaries, useSignal and useStore reactivity, serialization with dollar signs, useTask$ and useVisibleTask$, Qwik City routing, and integration with React components.
Fix: Biome Not Working — Rules Not Applied, ESLint Config Not Migrated, or VSCode Extension Ignored
How to fix Biome linter/formatter issues — biome.json configuration, migrating from ESLint and Prettier, VSCode extension setup, CI integration, and rule override syntax.
Fix: date-fns Not Working — Wrong Timezone Output, Invalid Date, or Locale Not Applied
How to fix date-fns issues — timezone handling with date-fns-tz, parseISO vs new Date, locale import and configuration, DST edge cases, v3 ESM migration, and common format pattern mistakes.
Fix: esbuild Not Working — Plugin Errors, CSS Not Processed, or Output Missing After Build
How to fix esbuild issues — entry points, plugin API, JSX configuration, CSS modules, watch mode, metafile analysis, external packages, and common migration problems from webpack.
Fix: HTMX Not Working — hx-get Request Not Firing, Swap Not Updating DOM, or Response Ignored
How to fix HTMX issues — attribute syntax, target and swap strategies, out-of-band swaps, event handling, CSP configuration, response headers, and debugging HTMX requests.
Fix: MSW (Mock Service Worker) Not Working — Handlers Not Intercepting, Browser Not Mocking, or v2 Migration Errors
How to fix Mock Service Worker issues — browser vs Node setup, handler registration, worker start timing, passthrough requests, and common MSW v2 API changes from v1.
Fix: next-intl Not Working — Translations Missing, Locale Not Detected, or Middleware Redirect Loop
How to fix next-intl issues — App Router setup with middleware, useTranslations in server and client components, locale detection, pluralization, number and date formatting, and routing configuration.
Fix: SolidJS Not Working — Signal Not Updating, Effect Running Twice, or createResource Data Undefined
How to fix SolidJS reactivity issues — signal access inside JSX, effect dependencies, createResource with loading states, Show and For components, store mutations, and common mistakes coming from React.
Fix: WebAssembly (WASM) Not Working — Module Fails to Load, Memory Error, or JS Interop Broken
How to fix WebAssembly issues — instantiateStreaming vs instantiate, CORS for WASM files, linear memory limits, wasm-bindgen JS interop, imports/exports mismatch, and WASM in bundlers.
Fix: XState Not Working — Machine Not Transitioning, Guards Not Running, or Actor Not Sending Events
How to fix XState v5 issues — state machine definition, guards and actions typed correctly, useMachine hook, createActor, context updates, child actors, and common v4 to v5 migration errors.
Fix: ESLint Config Not Working — Rules Ignored, Flat Config Errors, or Plugin Not Found
How to fix ESLint configuration issues — flat config vs legacy config, extends conflicts, parser options, plugin resolution, per-directory overrides, and migrating to ESLint 9.
Fix: IndexedDB Not Working — Transaction Inactive, Upgrade Blocked, or Store Not Found
How to fix IndexedDB issues — transaction lifecycle, version upgrades, blocked events, cursor iteration, IDBKeyRange queries, and using idb wrapper library to avoid callback hell.
Fix: tRPC Not Working — Type Inference Lost, Procedure Not Found, or Context Not Available
How to fix tRPC issues — router setup, type inference across packages, context injection, middleware, error handling, and common tRPC v10/v11 configuration mistakes.
Fix: TypeScript Conditional Types Not Working — infer Not Extracting, Distributive Behavior Unexpected, or Type Resolves to never
How to fix TypeScript conditional type issues — infer keyword usage, distributive conditional types, deferred evaluation, naked type parameters, and common conditional type patterns.
Fix: TypeScript Discriminated Union Error — Property Does Not Exist or Narrowing Not Working
How to fix TypeScript discriminated union errors — type guards, exhaustive checks, narrowing with in operator, never type, and common patterns for tagged unions.
Fix: TypeScript Template Literal Type Error — Type Not Assignable or Inference Fails
How to fix TypeScript template literal type errors — string combination types, conditional inference, Extract and mapped types with template literals, and common pitfalls.
Fix: Web Worker Not Working — postMessage Ignored, Cannot Import Module, or Worker Crashes Silently
How to fix Web Worker issues — postMessage data cloning, module workers, error handling, SharedArrayBuffer setup, Comlink, and common reasons workers silently fail.
Fix: Zod Validation Not Working — safeParse Returns Wrong Error, transform Breaks Type, or discriminatedUnion Fails
How to fix Zod schema validation issues — parse vs safeParse, transform and preprocess, refine for cross-field validation, discriminatedUnion, error formatting, and common schema mistakes.
Fix: Vite Proxy Not Working — API Requests Not Forwarded or 404/502 Errors
How to fix Vite dev server proxy issues — proxy configuration in vite.config.ts, path rewriting, WebSocket proxying, HTTPS targets, and common misconfigurations.
Fix: GraphQL Subscription Not Updating — WebSocket Connection Not Receiving Events
How to fix GraphQL subscriptions not receiving updates — WebSocket setup, subscription protocol, Apollo Client config, server-side pub/sub, authentication over WebSocket, and reconnection.
Fix: TypeScript Function Overload Error — No Overload Matches This Call
How to fix TypeScript function overload errors — overload signature compatibility, implementation signature, conditional types as alternatives, method overloads in classes, and common pitfalls.
Fix: TypeScript Mapped Type Errors — Type is Not Assignable to Mapped Type
How to fix TypeScript mapped type errors — Partial, Required, Readonly, Record, Pick, Omit, conditional types, template literal types, and distributive behavior.
Fix: Webpack Bundle Size Too Large — Reduce JavaScript Bundle for Faster Load Times
How to reduce Webpack bundle size — code splitting, tree shaking, dynamic imports, bundle analysis, moment.js replacement, lodash optimization, and production build configuration.
Fix: Webpack Dev Server Not Reloading — HMR and Live Reload Not Working
How to fix Webpack dev server not reloading — Hot Module Replacement configuration, watchFiles settings, polling for Docker/WSL, HMR API for custom modules, and port conflicts.
Fix: TypeScript Could Not Find Declaration File — Module Has No Type Information
How to fix TypeScript 'could not find a declaration file for module' errors — installing @types packages, writing custom .d.ts files, module augmentation, and tsconfig paths.
Fix: Webpack/Vite Path Alias Not Working — Module Not Found with @/ Prefix
How to fix path alias errors in webpack and Vite — configuring resolve.alias, tsconfig paths, babel-plugin-module-resolver, Vite alias configuration, and Jest moduleNameMapper.
Fix: Webpack Bundle Too Large — Chunk Size Warning
How to reduce Webpack bundle size — code splitting, lazy loading, tree shaking, analyzing the bundle with webpack-bundle-analyzer, replacing heavy dependencies, and configuring splitChunks.
Fix: Axios Network Error — Request Failed with Status Code 0
How to fix Axios 'Network Error' with no status code — CORS blocks, SSL certificate issues, request timeout, no internet connection, and debugging with interceptors.
Fix: ESLint no-unused-vars False Positives and Configuration
How to fix ESLint no-unused-vars false positives — TypeScript types, destructuring ignores, React imports, function arguments, and configuring the rule to match your codebase patterns.
Fix: TypeScript Enum Not Working — const enum, isolatedModules, and Runtime Issues
How to fix TypeScript enum problems — const enum with isolatedModules, enums not available at runtime, string vs numeric enums, and migrating to union types or as const objects.
Fix: Vite Environment Variables Not Working
How to fix Vite environment variables showing as undefined — missing VITE_ prefix, wrong .env file for the mode, import.meta.env vs process.env, TypeScript types, and SSR differences.
Fix: Vite Build Chunk Size Warning (Some Chunks Are Larger Than 500 kB)
How to fix Vite's chunk size warning — why bundles exceed 500 kB, how to split code with dynamic imports and manualChunks, configure the chunk size limit, and optimize your Vite production build.