skip to Main Content

I did all the step by step to run an ssr application, but without success.

config/inertia

export const inertia: InertiaConfig = {
  view: 'app',
  ssr: {
    enabled: true,
    autoreload: process.env.NODE_ENV === 'development'
  },
};

resources/js/ssr.js

import { createSSRApp, h } from 'vue';
import { renderToString } from '@vue/server-renderer';
import {createInertiaApp, Link} from '@inertiajs/vue3';

export default function render(page) {
  return createInertiaApp({
    page,
    render: renderToString,
    resolve: (name) => require(`./Pages/${name}`),
    setup({ app, props, plugin }) {
      return createSSRApp({
        render: () => h(app, props),
      }).use(plugin).component('inertia-link', Link);
    },
  });
}

run the commands

node ace serve –watch
node ace ssr:watch

require() of ES Module C:[email protected] from C:UsersProjetoinertiassrssr.js not supported. index.js is treated as an ES module file as it is a .js file whose nearest parent package.json contains "type": "module" which declares all .js files in that package scope as ES modules. Instead rename index.js to end in .cjs, change the requiring code to use dynamic import() which is available in all CommonJS modules, or change "type": "module" to "type": "commonjs" in C:[email protected] to treat all .js files as CommonJS (using .mjs for all ES modules instead).

2

Answers


  1. Chosen as BEST ANSWER

    Must be capitalized App

    setup({ App, props, plugin }) {
          return createSSRApp({
            render: () => h(App, props),
          }).use(plugin);
        },
    

  2. the issue here can be the use of require on the code line

    resolve: (name) => require(`./Pages/${name}`),
    

    instead use import

    resolve: (name) => import(`./Pages/${name}`),
    

    since you are already using ES modules in that file

    Login or Signup to reply.
Please signup or login to give your own answer.
Back To Top
Search