whatisgithub

What is babel-plugin-functional-hmr?

gaearon/babel-plugin-functional-hmr — explained in plain English

Analysis updated 2026-07-17 · repo last pushed 2019-10-14

★ 6Audience · developerComplexity · 2/5DormantSetup · moderate

In one sentence

A Babel plugin that fixes hot reloading for functional components in React Native, so code changes show up instantly during development.

Mindmap

mindmap
  root((repo))
    What it does
      Fixes hot reloading
      Transforms functions to classes
      Instant dev updates
    Tech stack
      Babel
      React Native
      JavaScript
    Limitations
      Arrow functions only
      No Hooks support
      Needs cache reset
    Audience
      React Native developers

Code map

Detail Auto

An interactive map of this repo's files and how they connect — its source is parsed live in your browser. Click Visualize to build it.

filefunction / class

What do people build with it?

USE CASE 1

See UI tweaks like color or layout changes appear instantly while developing a React Native app

USE CASE 2

Add this plugin to a Babel config to fix broken hot module reloading for functional components

USE CASE 3

Speed up the dev feedback loop when you're not yet using React Hooks

USE CASE 4

Debug why HMR isn't reflecting changes by understanding the class-component transform it does

What is it built with?

JavaScriptBabelReact Native

How does it compare?

gaearon/babel-plugin-functional-hmrabderazak-py/retro-homepageaclark4life/home-depot-crawl
Stars666
Language—HTMLPython
Last pushed2019-10-14—2014-08-10
MaintenanceDormant—Dormant
Setup difficultymoderateeasymoderate
Complexity2/52/52/5
Audiencedeveloperops devopsdeveloper

Figures from each repo's GitHub metadata at analysis time.

How do you get it running?

Difficulty · moderate Time to first run · 30min

Only works with arrow-function components without Hooks, Babel config changes need a packager cache reset.

Copy-paste prompts

Prompt 1
Help me add babel-plugin-functional-hmr to my Babel config for a React Native project.
Prompt 2
Explain how this plugin transforms an arrow function component into a class component for HMR.
Prompt 3
Why isn't hot reloading working after I changed my Babel config, and how do I reset the packager cache?
Prompt 4
What are the limitations of this HMR plugin if my components use React Hooks?

Frequently asked questions

What is babel-plugin-functional-hmr?

A Babel plugin that fixes hot reloading for functional components in React Native, so code changes show up instantly during development.

Is babel-plugin-functional-hmr actively maintained?

Dormant — no commits in 2+ years (last push 2019-10-14).

How hard is babel-plugin-functional-hmr to set up?

Setup difficulty is rated moderate, with roughly 30min to a first successful run.

Who is babel-plugin-functional-hmr for?

Mainly developer.

Open on GitHub → Ask about another repo

This repo across BitVibe Labs

Verify against the repo before relying on details.

What are similar repos?