SWR doesn't work

[naupaw]

Hi, im trying to using swr using the example from documentation here with little bit modifications

import useSWR from "https://esm.sh/swr"
import Axios from "https://esm.sh/axios";

const fetcher = (url: string) => Axios.get(url).then(({ data }) => data);

export default function About() {
  const { data } = useSWR('/api/me, fetcher)

  if (!data) {
    return <div>loading...</div>
  }
  return <div>hello {data.name}!</div>
}

when i trying to visit that page for the first time, gives me error message, and suddenly commands killed.

INFO Server ready on http://localhost:8080
ERROR ReferenceError: navigator is not defined
    at file:///home/hehex/a/.aleph/development.es2018/-/cdn.esm.sh/v4/[email protected]/es2018/swr.development.js:187:55
error: Uncaught ReferenceError: navigator is not defined
    at file:///home/hehex/a/.aleph/development.es2018/-/cdn.esm.sh/v4/[email protected]/es2018/swr.development.js:187:55

using Axios works pretty well, i think it because they trying to access navigation object through server side, that supposed to be in browser only.

var slowConnection = typeof window !== "undefined" && navigator["connection"] && ["slow-2g", "2g"].indexOf(navigator["connection"].effectiveType) !== -1;

[ije]

you can use Axios with useSWR Hook now, but will get a warning text:

Warning: useLayoutEffect does nothing on the server, because its effect cannot be encoded into the server renderer's output format. This will lead to a mismatch between the initial, non-hydrated UI and the intended UI. To avoid this, useLayoutEffect should only be used in components that render exclusively on the client. See https://reactjs.org/link/uselayouteffect-ssr for common fixes.

i just created a pull request to swr, hope it can fix this.

vercel/swr#754

[ije]

please upgrade the cli command:

aleph upgrade

[naupaw]

no problems, that looks good!