Element type is invalid: expected a string (for built-in components) or a class/function (for composite components) but got: object. and  Prerender (html): Received a 500 status code from `entry.server.tsx` while prerendering the `/` path.

reflex: 0.8.9
python: 3.12
os: windows 11
When I run "reflex run --env prod", an error occurs
I found that when I use the "echarts" control of "reflex_echarts", errors will be generated

```python
import json
import random
import asyncio
import reflex as rx
from pyecharts import options as opts
from pyecharts.charts import Kline, Line

class State(rx.State):
    option: dict = json.loads(
        Line().add_xaxis([0, 1, 2]) \
            .add_yaxis("kk", [0, 2, 3]) \
            .set_global_opts(
            title_opts=opts.TitleOpts(title="demo"),
            datazoom_opts=[
                opts.DataZoomOpts(
                    is_show=True,
                    type_='inside',
                ),
                opts.DataZoomOpts(
                    is_show=True,
                    type_='slider', 
                ),
            ],
            xaxis_opts=opts.AxisOpts(),
        ) \
            .dump_options_with_quotes()
    )
    _task: bool = False

    @rx.var(cache=False)
    def get_r(self) -> int:
        return random.randint(1, 10)

    @rx.event
    def get(self):
        self.option['xAxis'][0]['data'].append(len(self.option['xAxis'][0]['data']) + 1)
        self.option['series'][0]['data'].append([len(self.option['xAxis'][0]['data']) + 1, self.get_r])

    @rx.event
    def clear(self):
        self.option['xAxis'][0]['data'] = [0]
        self.option['series'][0]['data'] = [0, 0]

from reflex_echarts import echarts


def index() -> rx.Component:
    return rx.vstack(
        echarts (
            option=State.option,
        ),
        rx.button("button", on_click=State.get),
        rx.button("clear", on_click=State.clear),
        align="center",
    )
```
```
Creating Production Build failed with exit code 1
$ react-router build
rolldown-vite v7.1.5 building for production...
transforming...
✓ 2578 modules transformed.
rendering chunks...
computing gzip size...
build/client/.vite/manifest.json                               3.14 kB │ gzip:   0.59 kB
build/client/assets/__reflex_global_styles-V5m_xA4h.css      694.35 kB │ gzip:  83.36 kB
build/client/assets/reflex-env-CostSbh-.js                     0.28 kB │ gzip:   0.18 kB
build/client/assets/_404_._index-Bwj3K91n.js                   0.43 kB │ gzip:   0.31 kB
build/client/assets/rolldown-runtime-aUZGWTHk.js               0.62 kB │ gzip:   0.38 kB
build/client/assets/jsx-runtime-LPmOjBqq.js                    4.09 kB │ gzip:   1.54 kB
build/client/assets/emotion-react.browser.esm-DHMO-yE9.js     21.11 kB │ gzip:   8.27 kB
build/client/assets/root-CtpZCqOr.js                          43.68 kB │ gzip:  13.33 kB
build/client/assets/chunk-PVWAREVJ-ByEFXmki.js               115.55 kB │ gzip:  37.84 kB
build/client/assets/entry.client-tQlmaDMC.js                 175.94 kB │ gzip:  55.54 kB
build/client/assets/esm-D_Qqu_Zw.js                          558.50 kB │ gzip: 127.15 kB
build/client/assets/_index-CS3GRqUF.js                     1,132.84 kB │ gzip: 370.42 kB
[33m[EVAL] Warning:[0m Use of `eval` function is strongly discouraged as it poses security risks and may cause issues with minification.
     [38;5;246m╭[0m[38;5;246m─[0m[38;5;246m[[0m utils/state.js:157:24 [38;5;246m][0m
     [38;5;246m│[0m
 [38;5;246m157 │[0m [38;5;249m [0m[38;5;249m [0m[38;5;249mc[0m[38;5;249mo[0m[38;5;249mn[0m[38;5;249ms[0m[38;5;249mt[0m[38;5;249m
[0m[38;5;249mm[0m[38;5;249mo[0m[38;5;249md[0m[38;5;249mu[0m[38;5;249ml[0m[38;5;249me[0m[38;5;249m [0m[38;5;249m=[0m[38;5;249m
[0m[38;5;249ma[0m[38;5;249mw[0m[38;5;249ma[0m[38;5;249mi[0m[38;5;249mt[0m[38;5;249m
[0meval[38;5;249m([0m[38;5;249m`[0m[38;5;249mi[0m[38;5;249mm[0m[38;5;249mp[0m[38;5;249mo[0m[38;5;249mr[0m[38;5;249mt[0m[38;5;249m([0m[38;5;249md[0m[38;5;249
ma[0m[38;5;249mt[0m[38;5;249ma[0m[38;5;249mU[0m[38;5;249mr[0m[38;5;249mi[0m[38;5;249m)[0m[38;5;249m`[0m[38;5;249m)[0m[38;5;249m;[0m
 [38;5;240m    │[0m                        ──┬─
 [38;5;240m    │[0m                          ╰─── Use of `eval` function here.
[38;5;246m─────╯[0m

[33m[EVAL] Warning:[0m Use of `eval` function is strongly discouraged as it poses security risks and may cause issues with minification.
     [38;5;246m╭[0m[38;5;246m─[0m[38;5;246m[[0m utils/state.js:271:16 [38;5;246m][0m
     [38;5;246m│[0m
 [38;5;246m271 │[0m [38;5;249m [0m[38;5;249m [0m[38;5;249m [0m[38;5;249m [0m[38;5;249m [0m[38;5;249m
[0m[38;5;249ma[0m[38;5;249m.[0m[38;5;249mh[0m[38;5;249mr[0m[38;5;249me[0m[38;5;249mf[0m[38;5;249m [0m[38;5;249m=[0m[38;5;249m
[0meval[38;5;249m?[0m[38;5;249m.[0m[38;5;249m([0m
 [38;5;240m    │[0m                ──┬─
 [38;5;240m    │[0m                  ╰─── Use of `eval` function here.
[38;5;246m─────╯[0m

[33m[EVAL] Warning:[0m Use of `eval` function is strongly discouraged as it poses security risks and may cause issues with minification.
     [38;5;246m╭[0m[38;5;246m─[0m[38;5;246m[[0m utils/state.js:334:15 [38;5;246m][0m
     [38;5;246m│[0m
 [38;5;246m334 │[0m [38;5;249m [0m[38;5;249m [0m[38;5;249m [0m[38;5;249m [0m[38;5;249m [0m[38;5;249m [0m[38;5;249m [0m[38;5;249m [0m[38;5;249m [0m[38;5;249m
[0m[38;5;249m [0m[38;5;249m [0m[38;5;249m?[0m[38;5;249m
[0meval[38;5;249m([0m[38;5;249me[0m[38;5;249mv[0m[38;5;249me[0m[38;5;249mn[0m[38;5;249mt[0m[38;5;249m.[0m[38;5;249mp[0m[38;5;249ma[0m[38;5;249my[0m[38;5;249
ml[0m[38;5;249mo[0m[38;5;249ma[0m[38;5;249md[0m[38;5;249m.[0m[38;5;249mc[0m[38;5;249ma[0m[38;5;249ml[0m[38;5;249ml[0m[38;5;249mb[0m[38;5;249ma[0m[38;5;249mc
[0m[38;5;249mk[0m[38;5;249m)[0m
 [38;5;240m    │[0m               ──┬─
 [38;5;240m    │[0m                 ╰─── Use of `eval` function here.
[38;5;246m─────╯[0m

[33m[EVAL] Warning:[0m Use of `eval` function is strongly discouraged as it poses security risks and may cause issues with minification.
     [38;5;246m╭[0m[38;5;246m─[0m[38;5;246m[[0m utils/state.js:351:13 [38;5;246m][0m
     [38;5;246m│[0m
 [38;5;246m351 │[0m [38;5;249m [0m[38;5;249m [0m[38;5;249m [0m[38;5;249m [0m[38;5;249m [0m[38;5;249m [0m[38;5;249m [0m[38;5;249m [0m[38;5;249m [0m[38;5;249m
[0m[38;5;249m?[0m[38;5;249m
[0meval[38;5;249m([0m[38;5;249me[0m[38;5;249mv[0m[38;5;249me[0m[38;5;249mn[0m[38;5;249mt[0m[38;5;249m.[0m[38;5;249mp[0m[38;5;249ma[0m[38;5;249my[0m[38;5;249
ml[0m[38;5;249mo[0m[38;5;249ma[0m[38;5;249md[0m[38;5;249m.[0m[38;5;249mj[0m[38;5;249ma[0m[38;5;249mv[0m[38;5;249ma[0m[38;5;249ms[0m[38;5;249mc[0m[38;5;249mr
[0m[38;5;249mi[0m[38;5;249mp[0m[38;5;249mt[0m[38;5;249m_[0m[38;5;249mc[0m[38;5;249mo[0m[38;5;249md[0m[38;5;249me[0m[38;5;249m)[0m
 [38;5;240m    │[0m             ──┬─
 [38;5;240m    │[0m               ╰─── Use of `eval` function here.
[38;5;246m─────╯[0m

[33m[EVAL] Warning:[0m Use of `eval` function is strongly discouraged as it poses security risks and may cause issues with minification.
     [38;5;246m╭[0m[38;5;246m─[0m[38;5;246m[[0m utils/state.js:352:13 [38;5;246m][0m
     [38;5;246m│[0m
 [38;5;246m352 │[0m [38;5;249m [0m[38;5;249m [0m[38;5;249m [0m[38;5;249m [0m[38;5;249m [0m[38;5;249m [0m[38;5;249m [0m[38;5;249m [0m[38;5;249m [0m[38;5;249m
[0m[38;5;249m:[0m[38;5;249m
[0meval[38;5;249m([0m[38;5;249me[0m[38;5;249mv[0m[38;5;249me[0m[38;5;249mn[0m[38;5;249mt[0m[38;5;249m.[0m[38;5;249mp[0m[38;5;249ma[0m[38;5;249my[0m[38;5;249
ml[0m[38;5;249mo[0m[38;5;249ma[0m[38;5;249md[0m[38;5;249m.[0m[38;5;249mf[0m[38;5;249mu[0m[38;5;249mn[0m[38;5;249mc[0m[38;5;249mt[0m[38;5;249mi[0m[38;5;249mo
[0m[38;5;249mn[0m[38;5;249m)[0m[38;5;249m([0m[38;5;249m)[0m[38;5;249m;[0m
 [38;5;240m    │[0m             ──┬─
 [38;5;240m    │[0m               ╰─── Use of `eval` function here.
[38;5;246m─────╯[0m

[33m[EVAL] Warning:[0m Use of `eval` function is strongly discouraged as it poses security risks and may cause issues with minification.
     [38;5;246m╭[0m[38;5;246m─[0m[38;5;246m[[0m utils/state.js:361:15 [38;5;246m][0m
     [38;5;246m│[0m
 [38;5;246m361 │[0m [38;5;249m [0m[38;5;249m [0m[38;5;249m [0m[38;5;249m [0m[38;5;249m [0m[38;5;249m [0m[38;5;249m [0m[38;5;249m [0m[38;5;249m [0m[38;5;249m
[0m[38;5;249m [0m[38;5;249m [0m[38;5;249m?[0m[38;5;249m
[0meval[38;5;249m([0m[38;5;249me[0m[38;5;249mv[0m[38;5;249me[0m[38;5;249mn[0m[38;5;249mt[0m[38;5;249m.[0m[38;5;249mp[0m[38;5;249ma[0m[38;5;249my[0m[38;5;249
ml[0m[38;5;249mo[0m[38;5;249ma[0m[38;5;249md[0m[38;5;249m.[0m[38;5;249mc[0m[38;5;249ma[0m[38;5;249ml[0m[38;5;249ml[0m[38;5;249mb[0m[38;5;249ma[0m[38;5;249mc
[0m[38;5;249mk[0m[38;5;249m)[0m
 [38;5;240m    │[0m               ──┬─
 [38;5;240m    │[0m                 ╰─── Use of `eval` function here.
[38;5;246m─────╯[0m

✓ built in 3.95s
rolldown-vite v7.1.5 building SSR bundle for production...
transforming...
⚠️ Paths with dynamic/splat params cannot be prerendered when using `prerender: true`. You may want to use the `prerender()` API to prerender the following
paths:
  - *
✓ 19 modules transformed.
rendering chunks...

✓ 1 asset cleaned from React Router server build.
build\client\assets\__reflex_global_styles-V5m_xA4h.css

Error: Element type is invalid: expected a string (for built-in components) or a class/function (for composite components) but got: object.
    at renderElement (E:\Works\RedRedFireFire\.web\node_modules\react-dom\cjs\react-dom-server.node.production.js:4692:11)
    at retryNode (E:\Works\RedRedFireFire\.web\node_modules\react-dom\cjs\react-dom-server.node.production.js:4919:16)
    at renderNodeDestructive (E:\Works\RedRedFireFire\.web\node_modules\react-dom\cjs\react-dom-server.node.production.js:4732:7)
    at renderNode (E:\Works\RedRedFireFire\.web\node_modules\react-dom\cjs\react-dom-server.node.production.js:5177:14)
    at renderChildrenArray (E:\Works\RedRedFireFire\.web\node_modules\react-dom\cjs\react-dom-server.node.production.js:5067:7)
    at retryNode (E:\Works\RedRedFireFire\.web\node_modules\react-dom\cjs\react-dom-server.node.production.js:4933:9)
    at renderNodeDestructive (E:\Works\RedRedFireFire\.web\node_modules\react-dom\cjs\react-dom-server.node.production.js:4732:7)
    at renderElement (E:\Works\RedRedFireFire\.web\node_modules\react-dom\cjs\react-dom-server.node.production.js:4440:9)
    at retryNode (E:\Works\RedRedFireFire\.web\node_modules\react-dom\cjs\react-dom-server.node.production.js:4919:16)
    at renderNodeDestructive (E:\Works\RedRedFireFire\.web\node_modules\react-dom\cjs\react-dom-server.node.production.js:4732:7)
[Error: Unexpected Server Error]
✗ Build failed in 1.45s
Build failed with 1 error:


Error: Prerender (html): Received a 500 status code from `entry.server.tsx` while prerendering the `/` path.
<!DOCTYPE html><html lang="en"><head><meta charSet="utf-8"/><meta content="width=device-width, initial-scale=1" name="viewport"/><link rel="modulepreload"
href="/assets/manifest-605ddf33.js"/><link rel="modulepreload" href="/assets/entry.client-tQlmaDMC.js"/><link rel="modulepreload"
href="/assets/jsx-runtime-LPmOjBqq.js"/><link rel="modulepreload" href="/assets/chunk-PVWAREVJ-ByEFXmki.js"/><link rel="modulepreload"
href="/assets/rolldown-runtime-aUZGWTHk.js"/><link rel="modulepreload" href="/assets/root-CtpZCqOr.js"/><link rel="modulepreload"
href="/assets/reflex-env-CostSbh-.js"/><link rel="modulepreload" href="/assets/emotion-react.browser.esm-DHMO-yE9.js"/><link rel="modulepreload"
href="/assets/esm-D_Qqu_Zw.js"/><link rel="modulepreload" href="/assets/_index-CS3GRqUF.js"/><script>
// Only run in browser environment, not during SSR
if (typeof document !== 'undefined') {
    try {
        const theme = localStorage.getItem("theme") || "system";
        const systemPreference = window.matchMedia("(prefers-color-scheme: dark)").matches ? "dark" : "light";
        const resolvedTheme = theme === "system" ? systemPreference : theme;

        // Apply theme immediately - blocks until complete
        // Use classList to avoid overwriting other classes
        document.documentElement.classList.remove("light", "dark");
        document.documentElement.classList.add(resolvedTheme);
        document.documentElement.style.colorScheme = resolvedTheme;

    } catch (e) {
        // Fallback to system preference on any error (resolve "system" to actual theme)
        const fallbackTheme = window.matchMedia("(prefers-color-scheme: dark)").matches ? "dark" : "light";
        document.documentElement.classList.remove("light", "dark");
        document.documentElement.classList.add(fallbackTheme);
        document.documentElement.style.colorScheme = fallbackTheme;
    }
}
</script><link rel="stylesheet" href="/assets/__reflex_global_styles-V5m_xA4h.css" type="text/css"/></head><body><div data-is-root-theme="true"
data-accent-color="blue" data-gray-color="slate" data-has-background="true" data-panel-background="translucent" data-radius="medium" data-scaling="100%"
class="radix-themes css-0"><style data-emotion="css 17rg0dp">.css-17rg0dp{position:fixed;width:100vw;height:0;}</style><div title="Connection Error: "
class="css-17rg0dp"></div><section aria-label="Notifications alt+T" tabindex="-1" aria-live="polite" aria-relevant="additions text"
aria-atomic="false"></section><h1 style="font-size:24px">Application Error</h1><pre style="padding:2rem;background:hsla(10, 50%, 50%,
0.1);color:red;overflow:auto"></pre><script>
        console.log(
          "💿 Hey developer 👋. You can provide a way better UX than this when your app throws errors. Check out
https://reactrouter.com/how-to/error-boundary for more information."
        );
      </script></div><script>((storageKey2, restoreKey) => {
    if (!window.history.state || !window.history.state.key) {
      let key = Math.random().toString(32).slice(2);
      window.history.replaceState({ key }, "");
    }
    try {
      let positions = JSON.parse(sessionStorage.getItem(storageKey2) || "{}");
      let storedY = positions;
      if (typeof storedY === "number") {
        window.scrollTo(0, storedY);
      }
    } catch (error) {
      console.error(error);
      sessionStorage.removeItem(storageKey2);
    }
  })("react-router-scroll-positions", null)</script><script>window.__reactRouterContext =
{"basename":"/","future":{"unstable_middleware":false,"unstable_optimizeDeps":true,"unstable_splitRouteModules":false,"unstable_subResourceIntegrity":false,
"unstable_viteEnvironmentApi":false},"routeDiscovery":{"mode":"initial"},"ssr":false,"isSpaMode":false};window.__reactRouterContext.stream = new
ReadableStream({start(controller){window.__reactRouterContext.streamController = controller;}}).pipeThrough(new TextEncoderStream());</script><script
type="module" async="">import "/assets/manifest-605ddf33.js";
import * as route0 from "/assets/root-CtpZCqOr.js";
import * as route1 from "/assets/_index-CS3GRqUF.js";

  window.__reactRouterRouteModules = {"root":route0,"routes/_index":route1};

import("/assets/entry.client-tQlmaDMC.js");</script><template id="B:0"></template><div hidden
id="S:0"><script>window.__reactRouterContext.streamController.enqueue("[{\"_1\":2,\"_3\":-5,\"_4\":5},\"loaderData\",{},\"actionData\",\"errors\",{\"_6\":7}
,\"root\",{\"_8\":9,\"_10\":-7,\"_11\":12},\"message\",\"Unexpected Server Error\",\"stack\",\"__type\",\"Error\"]\n");</script><template
id="B:1"></template></div><script>$RC=function(b,c,e){c=document.getElementById(c);c.parentNode.removeChild(c);var
a=document.getElementById(b);if(a){b=a.previousSibling;if(e)b.data="$!",a.setAttribute("data-dgst",e);else{e=b.parentNode;a=b.nextSibling;var
f=0;do{if(a&&8===a.nodeType){var d=a.data;if("/$"===d)if(0===f)break;else
f--;else"$"!==d&&"$?"!==d&&"$!"!==d||f++}d=a.nextSibling;e.removeChild(a);a=d}while(a);for(;c.firstChild;)e.insertBefore(c.firstChild,a);b.data="$"}b._react
Retry&&b._reactRetry()}};$RC("B:0","S:0")</script><div hidden
id="S:1"><script>window.__reactRouterContext.streamController.close();</script></div><script>$RC("B:1","S:1")</script></body></html>
    at prerenderRoute (E:\Works\RedRedFireFire\.web\node_modules\@react-router\dev\dist\vite.js:4313:11)
    at processTicksAndRejections (node:internal/process/task_queues:105:5)
    at handlePrerender (E:\Works\RedRedFireFire\.web\node_modules\@react-router\dev\dist\vite.js:4223:7)
    at PluginContextImpl.handler (E:\Works\RedRedFireFire\.web\node_modules\@react-router\dev\dist\vite.js:3516:13)
    at plugin (file:///E:/Works/RedRedFireFire/.web/node_modules/rolldown/dist/shared/src-Chn1S4O2.mjs:3155:4)
    at plugin.<computed> (file:///E:/Works/RedRedFireFire/.web/node_modules/rolldown/dist/shared/src-Chn1S4O2.mjs:3417:12)
    at normalizeErrors (file:///E:/Works/RedRedFireFire/.web/node_modules/rolldown/dist/shared/src-Chn1S4O2.mjs:2275:18)
    at handleOutputErrors (file:///E:/Works/RedRedFireFire/.web/node_modules/rolldown/dist/shared/src-Chn1S4O2.mjs:3013:34)
    at transformToRollupOutput (file:///E:/Works/RedRedFireFire/.web/node_modules/rolldown/dist/shared/src-Chn1S4O2.mjs:3007:2)
    at RolldownBuild.write (file:///E:/Works/RedRedFireFire/.web/node_modules/rolldown/dist/shared/src-Chn1S4O2.mjs:4221:10)
    at buildEnvironment (file:///E:/Works/RedRedFireFire/.web/node_modules/vite/dist/node/chunks/dep-Ql2zlmoZ.js:33366:64)
    at Object.build (file:///E:/Works/RedRedFireFire/.web/node_modules/vite/dist/node/chunks/dep-Ql2zlmoZ.js:33780:19)
    at buildEnvironment (E:\Works\RedRedFireFire\.web\node_modules\@react-router\dev\dist\cli\index.js:1890:5)
    at async Promise.all (index 0)
    at viteBuild (E:\Works\RedRedFireFire\.web\node_modules\@react-router\dev\dist\cli\index.js:1926:3)
    at build (E:\Works\RedRedFireFire\.web\node_modules\@react-router\dev\dist\cli\index.js:1787:10) {
  errors: [Getter/Setter]
}
error: script "export" exited with code 1



Run with --loglevel debug  for the full log.
Creating Production Build:  ━━━━━━━━━━━━━━━━━━━━━━━━━━╸━━━━━━━━━━━━━  67% 2/3 0:00:06
[20:05:29] Reflex app stopped. 
```

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Uh oh!

Element type is invalid: expected a string (for built-in components) or a class/function (for composite components) but got: object. and Prerender (html): Received a 500 status code from `entry.server.tsx` while prerendering the `/` path. #5770

Metadata

Assignees

Labels

Type

Projects

Milestone

Relationships

Development

Element type is invalid: expected a string (for built-in components) or a class/function (for composite components) but got: object. and Prerender (html): Received a 500 status code from entry.server.tsx while prerendering the / path. #5770

Description

Metadata

Metadata

Assignees

Labels

Type

Projects

Milestone

Relationships

Development

Issue actions

Element type is invalid: expected a string (for built-in components) or a class/function (for composite components) but got: object. and Prerender (html): Received a 500 status code from `entry.server.tsx` while prerendering the `/` path. #5770