Skip to content

deps of a library are not found unless explicitly defined in vite config alias #74

@uriva

Description

@uriva

I have a preact project, call it A where I depend on https://jsr.io/@alice-and-bot/core, let's call it B.

B has some preact components I'm using.

I see that at least in JSR all deps of B are recognized correctly.

I notice that in A, if I don't define the deps of B as aliases, it doesn't find the files.

This is the vite config in A:

import deno from "@deno/vite-plugin";
import preact from "@preact/preset-vite";
import { defineConfig } from "vite";

export default defineConfig({
  root: "./web",
  server: { port: 3000 },
  plugins: [preact(), deno()],
  resolve: {
    alias: {
      "npm:@instantdb/admin@0.19.10": "@instantdb/admin",
      "npm:@instantdb/core@0.19.10": "@instantdb/core",
      "npm:@instantdb/core@0.19.5": "@instantdb/core",
      "npm:@instantdb/react@0.19.10": "@instantdb/react",
      "npm:@instantdb/react@0.19.5": "@instantdb/react",
      "npm:@preact/signals@2.1.1": "@preact/signals",
      "npm:/preact@10.26.7/compat": "preact/compat",
      "npm:/preact@10.26.7/hooks": "preact/hooks",
      "npm:buffer@6.0.3": "buffer",
      "npm:preact@^10.22.1/jsx-runtime": "preact/jsx-runtime",
      "npm:preact@10.26.7": "preact",
      "npm:react-icons@5.5.0/fa": "react-icons/fa",
      "npm:react-markdown@10.1.0": "react-markdown",
      "npm:safe-stable-stringify@2.5.0": "safe-stable-stringify",
    },
  },
});

This is my deno.json in B:

{
  "tasks": {
    "build-landing": "cd landing; deno run -A --node-modules-dir=auto npm:vite build",
    "landing": "cd landing; deno run -A --node-modules-dir=auto npm:vite",
    "widget": "cd widget && deno run -A --node-modules-dir=auto npm:vite build --config vite.config.ts",
    "dev": "cd clients/react; deno run -A --node-modules-dir=auto npm:vite",
    "build": "deno run -A --node-modules-dir=auto npm:vite build"
  },
  "imports": {
    "@deno/vite-plugin": "npm:@deno/vite-plugin@^1.0.5",
    "@instantdb/admin": "npm:@instantdb/admin@0.19.10",
    "@instantdb/core": "npm:@instantdb/core@0.19.10",
    "@instantdb/react": "npm:@instantdb/react@0.19.10",
    "@preact/preset-vite": "npm:@preact/preset-vite@2.10.2",
    "@preact/signals": "npm:@preact/signals@2.1.1",
    "@std/assert": "jsr:@std/assert@1",
    "buffer": "npm:buffer@6.0.3",
    "gamla": "npm:gamla@124.0.0",
    "posthog-js": "npm:posthog-js@1.215.6",
    "preact-iso": "npm:preact-iso@2.9.1",
    "preact": "npm:preact@10.26.7",
    "preact/hooks": "npm:preact@10.26.7/hooks",
    "preact/jsx-runtime": "npm:preact@10.26.7/jsx-runtime",
    "react-hot-toast": "npm:react-hot-toast@2.5.2",
    "react-icons/fa": "npm:react-icons@5.5.0/fa",
    "react-markdown": "npm:react-markdown@10.1.0",
    "safe-stable-stringify": "npm:safe-stable-stringify@2.5.0",
    "typed-api": "jsr:@uri/typed-api@0.0.10",
    "vite": "npm:vite@^7.0.2",
    "zod": "npm:zod@3.25.57"
  },
  "unstable": ["cron"],
  "compilerOptions": {
    "jsx": "react-jsx",
    "jsxImportSource": "preact",
    "types": []
  },
  "license": "MIT",
  "name": "@alice-and-bot/core",
  "version": "0.0.72",
  "exports": "./mod.ts"
}

I find myself having to copy the list of deps of B, to this config file in A, which sounds like something is broken or I'm not using the tools correctly.

If I don't do this I get errors like this:

Uncaught SyntaxError: The requested module '/.vite/deps/preact.js?v=f7c24dbc' does not provide an export named 'useEffect' (at 875f4ece745c8d1bc906617f7542e93998f8575fa19f25c13bd4cdc910152178:2:10)

This is from running deno run -A --node-modules-dir=auto npm:vite in project A.

which imply that the deps of B are not found. In this case preact/hooks

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions