Webux Lab

By Studio Webux

Setup zed and deno

TG
Tommy Gingras Studio Webux 2024-07-30

Setup deno using zed IDE

This is a quick and short article to setup zeddotdev with Deno

Project structure

.zed/
app/
  backend/
    src/
      bin/
        main.tsx
  deno.json # <- Project Deno JSON
deno.json # <- Root Deno JSON

So I had a bunch of “issues” (like sguilly red lines all of the place)

The fixes are as follow:

Root deno.json

{
  "compilerOptions": {
    "jsx": "react-jsx",
    "jsxImportSource": "preact"
  },
  "imports": {
    "preact/": "https://esm.sh/preact@10.19.2/"
  }
}

Root deno.json

{
  "imports": {
    "hono": "jsr:@hono/hono@^4.5.0",
    "@hono/zod-validator": "npm:@hono/zod-validator",
    "zod": "npm:zod",
    "postgresjs": "https://deno.land/x/postgresjs@v3.4.4/mod.js",
    "dotenv": "https://deno.land/std@0.224.0/dotenv/mod.ts"
  },
  "tasks": {
    "start": "deno run --allow-net --allow-read --allow-env --allow-write --allow-run --watch src/bin/main.tsx"
  },
  "compilerOptions": {
    "jsx": "precompile",
    "jsxImportSource": "hono/jsx"
  }
}

.zed/settings.json

{
  "languages": {
    "TypeScript": {
      "language_servers": [
        "deno",
        "!typescript-language-server",
        "!vtsls",
        "!eslint",
        "..."
      ]
    },
    "TSX": {
      "language_servers": [
        "deno",
        "!typescript-language-server",
        "!vtsls",
        "!eslint",
        "..."
      ]
    }
  },
  "deno": { "enable": true }
}

Using this configuration (after restarting zed editor) everything worked fine.

References


Search