solidjs / solid-refresh

MIT License
86 stars 18 forks source link

Uncaught ReferenceError: ___ is not defined #59

Closed binajmen closed 9 months ago

binajmen commented 9 months ago

This code is raising an unexpected ReferenceError:

import { createQuery } from "@tanstack/solid-query";
import { For, Match, Switch } from "solid-js";
import { RESTClient } from "../lib/restclient";

type Category = {
  id: string;
  name: string;
};

export default function Categories() {
  const categories = createQuery<Category[]>(() => ({
    queryKey: ["categories"],
    queryFn: async () => {
      const rest = new RESTClient({ debug: true });
      const response = await rest.performRequest({
        method: "GET",
        path: "/api/categories",
      });
      if (!response.ok) {
        throw new Error("Network response was not ok");
      }
      return response.data as Category[];
    },
  }));

  console.log({ categories });

  return (
    <div>
      <h1>Categories</h1>
      <p>{String(Boolean(categories))}</p>
      <Switch>
        <Match when={categories.isPending}>
          <p>Loading...</p>
        </Match>
        <Match when={categories.isError}>
          <p>Error: {categories.error!.message}</p>
        </Match>
        <Match when={categories.isSuccess}>
          <p>Success</p>
          <For each={categories.data!}>
            {(category) => <p>{category.name}</p>}
          </For>
        </Match>
      </Switch>
    </div>
  );
}

https://stackblitz.com/github/binajmen/budget?file=src%2Fpages%2Fcategories.tsx

  1. Open the stackblitz
  2. Visit /categories
  3. Open the dev tools and check the console
categories.tsx:33 Uncaught ReferenceError: categories is not defined
    at get when (categories.tsx:33:20)
    at Switch.createMemo.equals.equals [as fn] (chunk-DIOA272S.js?v=36072530:1608:28)
    at runComputation (chunk-DIOA272S.js?v=36072530:800:22)
    at updateComputation (chunk-DIOA272S.js?v=36072530:782:3)
    at createMemo (chunk-DIOA272S.js?v=36072530:344:10)
    at Switch (chunk-DIOA272S.js?v=36072530:1604:22)
    at chunk-DIOA272S.js?v=36072530:647:12
    at untrack (chunk-DIOA272S.js?v=36072530:536:12)
    at Object.fn (chunk-DIOA272S.js?v=36072530:643:37)
    at runComputation (chunk-DIOA272S.js?v=36072530:800:22)

FYI, disabling hot reload solve the issue:

    solidPlugin({
      hot: false,
    }),