'solid-js/web' does not provide an export named 'effect'

[aminya]

Describe the bug

I am trying to use Kobalte in Astro, but it errors out because of missing effect export in solid-js/web when it tries to do server-side rendering it seems.

file:///media/aminya/test/node_modules/.pnpm/@kobalte+core@0.12.6_solid-js@1.8.16/node_modules/@kobalte/core/dist/esm/index.js:18
import { isServer, createComponent, effect, setAttribute, template, Dynamic, mergeProps as mergeProps$1, memo, Portal, use, spread, insert, style, delegateEvents } from 'solid-js/web';
                                    ^^^^^^
SyntaxError: The requested module 'solid-js/web' does not provide an export named 'effect'
    at ModuleJob._instantiate (node:internal/modules/esm/module_job:134:21)
    at async ModuleJob.run (node:internal/modules/esm/module_job:217:5)
    at async ModuleLoader.import (node:internal/modules/esm/loader:323:24)
    at async nodeImport (file:///media/aminya/test/node_modules/.pnpm/vite@5.2.8_@types+node@20.12.7_terser@5.30.3/node_modules/vite/dist/node/chunks/dep-whKeNLxG.js:55109:17)
    at async ssrImport (file:///media/aminya/test/node_modules/.pnpm/vite@5.2.8_@types+node@20.12.7_terser@5.30.3/node_modules/vite/dist/node/chunks/dep-whKeNLxG.js:55011:24)
    at async eval (/media/aminya/test/packages/website_admin/src/components/Tables/Table/CreateButton.tsx:7:31)
    at async instantiateModule (file:///media/aminya/test/node_modules/.pnpm/vite@5.2.8_@types+node@20.12.7_terser@5.30.3/node_modules/vite/dist/node/chunks/dep-whKeNLxG.js:55071:9)

To Reproduce
Steps to reproduce the behavior:

1. Create an Astro project with Solid-js
2. Use client:load for the Solid-js component
3. Import a component like Dialog from @kobalte/core
4. See error

Expected behavior

solid-js/web doesn't export effect in some scenarios. That should be handled.

Screenshots

Desktop (please complete the following information):

• OS: Linux
• Browser Edge

Additional context

The versions:

    "@astrojs/solid-js": "^4.1.0",
    "@kobalte/core": "^0.12.6",
    "solid-js": "^1.8.16",
    "astro": "^4.6.1",

[jer3m01]

Kobalte exports 2 builds, a precompiled client ESM and an uncompiled JSX version meant for server rendering.

It looks like Astro is importing the wrong one, I'll have a look.

[aminya]

I tested "@kobalte/core": "^0.13.1", but it still has the issue even with import Dialog from "@kobalte/core/dialog"

file:///node_modules/@kobalte/core/dist/chunk/XYP6O4WD.js:10
import { createComponent, mergeProps, memo, Portal } from 'solid-js/web';
                                      ^^^^
SyntaxError: The requested module 'solid-js/web' does not provide an export named 'memo'
    at ModuleJob._instantiate (node:internal/modules/esm/module_job:134:21)
    at async ModuleJob.run (node:internal/modules/esm/module_job:217:5)
    at async ModuleLoader.import (node:internal/modules/esm/loader:323:24)
    at async nodeImport (file:///node_modules/vite/dist/node/chunks/dep-cNe07EU9.js:55096:17)
    at async ssrImport (file:///node_modules/vite/dist/node/chunks/dep-cNe07EU9.js:54998:24)
    at async eval (test.tsx:7:31)
    at async instantiateModule (file:///node_modules/vite/dist/node/chunks/dep-cNe07EU9.js:55058:9)

Could you also include the src files and allow importing it from the package.json? Something like the following

Details

  "exports": {
    ".": {
      "types": "./dist/index.d.ts",
      "solid": "./dist/index.jsx",
      "default": "./dist/index.js"
    },
    "./*": {
      "types": "./dist/*/index.d.ts",
      "solid": "./dist/*/index.jsx",
      "default": "./dist/*/index.js"
    },
    "./src/*": {
      "solid": "./src/*/index.tsx",
      "default": "./src/*/index.ts"
    }
  },

[jer3m01]

Conversation continued in #408.