Ninja Parading Musically

    solid-reactor
    TypeScript icon, indicating that this package has built-in type declarations

    1.2.1 • Public • Published

    Reactor

    SWC EmitKit


    CLICK HERE FOR SOLIDHACK SUBMISSION DEMO VIDEO

    A compiler to ease the move from React to SolidJS.

    Features

    • Converts the following hooks to Solid equivalents:

      • useState -> createSignal
      • useEffect -> createEffect
        • attempting to recreate the "run on every rerender" behaviour
      • useReducer -> createSignal + a function
      • useRef -> { current: <value> } + a variable
        • convert (useRef-returned only) refs in ref={myRef} to ref={myRef.current}.
    • Converts camel case (marginRight) style names to skewer case (margin-right)

    Example

    export default () => {
      const [state, setState] = React.useState(0);
    
      let [, rerender] = useReducer((a) => ~a, 0);
    
      Reactor.useEffect(() => console.log(state));
    
      const myRef = useRef();
    
      return (
        <>
          <button onClick={() => setState(state * 2)} style={`color: red`} />
    
          {state}
    
          <div style={{ marginRight: "5rem" }}>
            <span ref={myRef} />
          </div>
        </>
      );
    };
    export default () => {
      const [state, setState] = createSignal(0);
    
      let [$$__REACTOR_UNIQUE_VAR_1, $$__REACTOR_UNIQUE_VAR_0] = createSignal(0);
      const rerender = () =>
        $$__REACTOR_UNIQUE_VAR_0(((a) => ~a)($$__REACTOR_UNIQUE_VAR_1()));
    
      createEffect(() => console.log(state()));
    
      const myRef = {};
    
      return (
        <>
          <button onClick={() => setState(state() * 2)} style={`color: red`} />
    
          {state()}
    
          <div style={{ "margin-right": "5rem" }}>
            <span ref={myRef.current} />
          </div>
        </>
      );
    };

    (output hand-prettified, but youre likely to either be using this as a build step, or have a codebase with a formatter setup)

    Install

    npm i solid-reactor

    DownloadsWeekly Downloads

    23

    Version

    1.2.1

    License

    BSD-3-Clause

    Unpacked Size

    23.3 kB

    Total Files

    27

    Last publish

    Collaborators

    • yellowsink