Remix v2 (w/ vite) cannot import survey-core

[yuku]

Are you requesting a feature, reporting a bug or asking a question?

reporting a bug

What is the current behavior?

import { Model } from "survey-core"

causes the following error in a server:

[vite] Error when evaluating SSR module virtual:remix/server-build: failed to import "survey-core" |- SyntaxError: [vite] Named export 'Model' not found. The requested module 'survey-core' is a CommonJS module, which may not support all module.exports as named exports. CommonJS modules can always be imported via the default export, for example using:

import pkg from 'survey-core';
const {Model} = pkg;

and then we update the code as the error message suggests:

import pkg from "survey-core"
const { Model } = pkg

then the following error occurs on a browser:

TypeError: Cannot read properties of undefined (reading 'Model')

screen shots

 

Same error happens with survey-react-ui package.

What is the expected behavior?

Can import and use.

How would you reproduce the current behavior (if this is a bug)?

1. npx create-remix@latest
2. npm install survey-react-ui --save
3. import survey-core to app/routes/_index.tsx
4. npm run dev then open http://localhost:5173

Or

git clone https://github.com/yuku/survey-core-repro.git
cd survey-core-repro
npm install
npm run dev

[!NOTE] yuku/survey-core-repro contains only two commits:

1. first commit => made by npx create-remix@latest
2. https://github.com/yuku/survey-core-repro/commit/b51f67c5b91e9703a77a21ad05d130927857af7b => add dependency and update a route file.

Specify your

• browser:
• browser version:
• surveyjs platform (angular or react or jquery or knockout or vue): react
• surveyjs version: 1.12.3

[JaneSjs]

Hi @yuku, I suppose the issue occurs because the SurveyModel is being used within a SSR component. Take note that SurveyJS Form Library doesn't support server-side rendering. It works on a client-side only. You can find an example on how to integrate SurveyJS components to a Remix app at https://github.com/surveyjs/surveyjs-remix.

Should you have any further questions, please feel free to reach out to us.

[yuku]

@JaneSjs Moving import statement to .client modules solves the issue. Thanks!