Alias React to Preact in code components

balintbrews → credited effulgentsia → .

@effulgentsia had this idea a while back.

Code component to test with:

import React from "react";
import ReactDOM from "react-dom";
import { useState, useEffect, useRef } from "react";

console.log("React:", React);
console.log("ReactDOM:", ReactDOM);
console.log("useState:", useState);
console.log("useEffect:", useEffect);
console.log("useRef:", useRef);

const Test = () => {
  const [count, setCount] = useState(0);
  
  const createdElement = React.createElement("div", null, [
    React.createElement("h1", null, "Import Map Test (createElement)"),
    React.createElement("p", null, `Count: ${count}`),
    React.createElement("button", { 
      onClick: () => setCount(count + 1) 
    }, "Increment")
  ]);
  
  return (
    <div>
      {createdElement}
      <div>
        <h1>Import Map Test (JSX)</h1>
        <p>Count: {count}</p>
        <button onClick={() => setCount(count + 1)}>
          Increment
        </button>
      </div>
      {count > 5 && (
        <div style={{ color: 'green', marginTop: '20px' }}>
          Count is greater than 5!
        </div>
      )}
      <ul>
        {[1, 2, 3].map(item => (
          <li key={item}>Item {item}</li>
        ))}
      </ul>
    </div>
  );
};

export default Test;

balintbrews → credited lauriii → .

Also @lauriii prompted us to fill this gap.

Very nice!