Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Attempted import error #2175

Open
IsaccoSordo opened this issue May 28, 2024 · 1 comment
Open

Attempted import error #2175

IsaccoSordo opened this issue May 28, 2024 · 1 comment

Comments

@IsaccoSordo
Copy link

Describe the bug

Hello,

We are receiving reports from users that importing our SDK into their SSR applications results in the following errors:

Attempted import error: 'effect' is not exported from 'solid-js/web'
Attempted import error: 'memo' is not exported from 'solid-js/web' (imported as 'memo')
Attempted import error: 'template' is not exported from 'solid-js/web' (imported as 'template')
Error: export 'style' (imported as 'style') was not found in 'solid-js/web'

We attempted to resolve these issues by updating our rollup configuration file from this version to this version, explicitly excluding Solid dependencies from the bundle.
Despite this, we continue to encounter the same errors when importing our module into a NextJS app.

I've linked a StackBlitz repository to this issue, which hosts a NextJS app attempting to import a SolidJS component, where one of the errors occurs.

For instance from our observations, directly calling createEffect in the example app does not trigger the error, but it seems that when it gets transpiled the error appears.
If createEffect is called through the html property from import html from "solid-js/html";, we encounter the "Attempted import" error.

Thank you for your attention to this matter.

Your Example Website or App

https://stackblitz.com/edit/stackblitz-starters-dttbwm?file=app%2Fpage.tsx,packages%2Fmy-ui-lib%2Fsrc%2FApp.tsx

Steps to Reproduce the Bug or Issue

One way we found to consistently reproduce the issue is as follows:

  1. Set up a NextJS application.
  2. In the NextJS app, import html from solid-js using the statement: import html from "solid-js/html";.
  3. Attempt to use a SolidJS component within the NextJS application.

This should trigger the error mentioned above.

Expected behavior

The "Attempted import" errors should not appear in the console.

Screenshots or Videos

No response

Platform

Versions tested: 1.7.6, 1.7.11

Additional context

No response

@ryansolid
Copy link
Member

ryansolid commented May 28, 2024

It looks like client bundled code is running on the server. Stuff like template is from client compiled code.

Our html and h libraries are client-only currently and do not support SSR as they rely on DOM APIs being present. So importing them on the server could easily produce bugs like that. We use our JSX which gets compiled for each environment.

If there is no need to server render these pieces. I suggest putting them in a dynamic import that is not resolved on the server... or if Next has any client only functionality that doesn't import the code. The problem is excluding Solid from the bundle, even solid-js/html is probably not going to be enough because whatever imports that is going to complain it can't find that import since it exists in the code. The whole entry point of import just needs to not be there in the code. Whether that is using like some sort of alias replacement or uninitialized dynamic import.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants