esm-react

es-react

an es module exposing the latest version of react and react-dom

Ever wanted to just import React into your project as a module without a build step or even script tags? It is 2019 now and browser support for native module imports is pretty good, so this should be possible but the react team – for one reason or another – haven't decided to provide a build that will let you do this yet.

This package however allows you import react and react-dom straight from a CDN:

import { React, ReactDOM } from 'https://unpkg.com/es-react';
ReactDOM.render(
  React.createElement('h1', {}, 'Hello from es-react'),
  document.body
)

Features

• All the latest react features (hooks, suspense, lazy, memo etc.)
• Use react directly from any javascript file (no build step required)

Usage

Import React and ReactDOM directly from any script with type="module". The package is intended to be available from unpkg (without having to append ?module to the package name).

import { React, ReactDOM } from 'https://unpkg.com/es-react@16.8.3';

The version of this package is set to match the version of react that it exposes. It is strongly advised that you specify a version when requesting the module – this speeds up the request time and helps with caching. If you don't specify a number then unpkg will redirect and serve up the latest available version.

Implementation

The latest (development) umd builds of react and react-dom – which you can find here and here respectively – were taken and edited by hand in order to suitable for distribution as an ES module.

This is currently an experiment but if it proves popular (and the react team don't decide to output a similar build) then perhaps I might decide to automate this process in order to keep this package up to date with latest releases.

Acknowledgements

Barely any of the code in this repo is written by myself. It is just a wrapper for React that is written and maintained by the team at Facebook. Thanks to my employer Formidable Labs for allowing me the time to think about and work on fun and experimental projects like this.