Valtio on Deno with Preact

[italodeandra]

This is just for future refence.

What you need to do to make it work is to import valtio with an alias.

import { proxy } from "https://esm.sh/[email protected][email protected]&alias=react:preact/hooks"

You can also use import_map.json to not need to import this entire URL everywhere.

// import_map.json
{
  "imports": {
    "valtio": "https://esm.sh/[email protected][email protected]&alias=react:preact/hooks"
  }
}

// state.ts
import { proxy } from "valtio"

[dai-shi]

Hm, we have some discussions in https://github.com/pmndrs/jotai/issues/1081. How do you deal with __DEV__ global variable?

Thanks for sharing anyway.

[italodeandra]

How do you deal with __DEV__ global variable?

What would be that variable? I'm still not using valtio broadly on this deno+preact (fresh) application, my usage is very simple.

[dai-shi]

It's a variable which is true in development mode and false in production mode.

[italodeandra]

In Deno we usually have two separate files that start our application. One for the actual app server (the one that we use directly when on production) and another one for the dev environment (which then reuse the other file that is the actual app server).

In this dev environment file you could do something like:

// dev.ts

import dev from "$fresh/dev.ts";

window.__DEV__ = true;

await dev(import.meta.url, "./main.ts");

Then the global variable would exist only in the dev environment.

[dai-shi]

I hope v1.10.4 is somewhat friendly with Deno. If there's a problem, please open a new discussion.