server icon indicating copy to clipboard operation
server copied to clipboard

React SSR route error

Open oriolvinals opened this issue 2 years ago • 0 comments

When i load a page from ssr server i get this error-

TypeError: Cannot read properties of undefined (reading 'home')
    at new f (/var/www/canmateu/node_modules/ziggy-js/dist/index.js:1:4137)
    at /var/www/canmateu/node_modules/ziggy-js/dist/index.js:1:7508
    at Header (file:///var/www/canmateu/bootstrap/ssr/assets/app-layout-bcb5d093.mjs:22:162)
    at renderWithHooks (/var/www/canmateu/node_modules/react-dom/cjs/react-dom-server-legacy.node.development.js:5662:16)
    at renderIndeterminateComponent (/var/www/canmateu/node_modules/react-dom/cjs/react-dom-server-legacy.node.development.js:5735:15)
    at renderElement (/var/www/canmateu/node_modules/react-dom/cjs/react-dom-server-legacy.node.development.js:5950:7)
    at renderNodeDestructiveImpl (/var/www/canmateu/node_modules/react-dom/cjs/react-dom-server-legacy.node.development.js:6108:11)
    at renderNodeDestructive (/var/www/canmateu/node_modules/react-dom/cjs/react-dom-server-legacy.node.development.js:6080:14)
    at renderNode (/var/www/canmateu/node_modules/react-dom/cjs/react-dom-server-legacy.node.development.js:6263:12)
    at renderChildrenArray (/var/www/canmateu/node_modules/react-dom/cjs/react-dom-server-legacy.node.development.js:6215:7)

This is mine ssr.tsx file

import ReactDOMServer from "react-dom/server";
import { createInertiaApp } from "@inertiajs/react";
import createServer from "@inertiajs/react/server";
import { resolvePageComponent } from "laravel-vite-plugin/inertia-helpers";
import route from "../../vendor/tightenco/ziggy/dist/index.m";
import React from "react";
import { Provider } from "react-wrap-balancer";
import { Ziggy } from "./ziggy";

const appName = "Laravel";

createServer((page) =>
    createInertiaApp({
        page,
        render: ReactDOMServer.renderToString,
        title: (title) => `${title} - ${appName}`,
        resolve: (name) =>
            resolvePageComponent(`../views/pages/${name}.tsx`, import.meta.glob("../views/pages/**/*.tsx")),
        setup: ({ App, props }) => {
            global.route = (name, params, absolute, config = Ziggy) => route(name, params, absolute, config);

            return (
                <Provider>
                    <App {...props} />
                </Provider>
            );
        },
    }),
);

I'm missing something?

oriolvinals avatar Aug 01 '23 20:08 oriolvinals