react-hotifydeprecated

A generic library implementing hot reload for React components without unmounting or losing their state.

Usage no npm install needed!

<script type="module">
  import reactHotify from 'https://cdn.skypack.dev/react-hotify';
</script>

README

React Hotify

This project is a successor of React Hot API.
It has less features and is much less mature.

For now, use at your own risk.
Read The Death of React Hot Loader for some context.

Usage

Annotate component classes with the decorator this library exports. The decorator accepts one parameter: a string uniquely identifying the given component class in your application. It should persist between the live edit reloads. For example, you can use the module filename concatenated with the class name.

You should generate these decorator calls (e.g. with a Babel plugin) so users don't have to write them.

Examples

Webpack

import React from 'react';
import hotify from 'react-hotify'; // Your tool should generate this

@hotify(`${module.id}-Other`) // Your tool should generate this
class Other {
  render() {
    return (
      <h1>hmm.</h1>
    );
  }
}

@hotify(`${module.id}-App`) // Your tool should generate this
export default class App extends React.Component {
  render() {
    return (
      <Other />
    );
  }
}

// Opt-in to Webpack hot module replacement for the module
module.hot.accept(); // Your tool should generate this

Browserify

???

Tests

This time, we've got tests!

npm install
npm test

License

MIT