-
Notifications
You must be signed in to change notification settings - Fork 115
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
bug: Next.js + SSR components - 'ReferenceError: Node is not defined' #479
Comments
Thanks for the issue! This project is currently maintained for the purposes of supporting Ionic Framework. At this time, only new issues & pull requests that support Ionic Framework will be prioritized. For the latest updates regarding the maintenance status of this project, please see this section of the project's README |
@guilhermebc thanks for raising the issue, mind providing a minimal reproduction case as GitHub project? Maybe start with out designsystem boilerplate project and make changes that reproduce this case. |
Thanks for the issue! This issue has been labeled as Please reproduce this issue in a Stencil project and provide a way for us to access it (GitHub repo, etc). Without a reliable code reproduction, it is unlikely we will be able to resolve the issue, leading to it being closed. If you have already provided a code snippet and are seeing this message, it is likely that the code snippet was not enough for our team to reproduce the issue. |
Design system repo: https://github.com/guilhermebc/gbc-design-system The version I ended up discovering that the cause of the error is coming from the extra settings we need to apply for slot correction:
I generated a version To reproduce, just download the repository https://github.com/guilhermebc/nextjs-with-stencil-ssr: PS: To simulate without the error, just install the version |
Thanks for the issue! This issue is being closed due to the lack of a code reproduction. If this is still an issue with the latest version of the output targets, please create a new issue and ensure the template is fully filled out. |
Prerequisites
Stencil Version
4.21.0
Stencil Framework Output Target
React
Stencil Framework Output Target Version
0.7.1
Current Behavior
Hello, I work at a company where we use Stencil for the internal design system and export it to React, as we have projects in Next.js (^14.2.3).
We use version ^0.5.3 of the @stencil/react-output-target package for using the components in Next.js projects and were waiting for the launch of SSR support.
As soon as the SSR components support was released for react-output-target, I went to test updating it in the company's design system, but I am not able to compile the application, I followed all the steps in the Stencil documentation.
Our design system is published in a private repository manager, and we install it in the company's applications (Vue apps, Next.js apps, etc).
Error:
Expected Behavior
Setup Next.js app router + SSR + Stencil react output target components.server working
Steps to Reproduce
In separate repositories, create a design system (design-system-web-components) in Stencil (^4.21.0)
design-system-web-components
Setup the react-output-target (^0.7.1) para ssr:
stencil.config.ts
ofdesign-system-web-components
tsconfig.json
design-system-nextjs
package.json
tsconfig.json
Follow all the documentation: https://stenciljs.com/docs/react; Publish the design-system-web-components and design-system-nextjs libraries;
In another repository, create the Next.js application following the standard with App router, TypeScript, ESLint:
Install the design-system-nextjs library;
Import a component from the library in app/page.tsx;
Run
next build
ornext dev
commands and the error will appear.Code Reproduction URL
Additional Information
The text was updated successfully, but these errors were encountered: