Level 102
Try installing and using this instead of aliasing it from composer/vendor https://www.npmjs.com/package/ziggy-js
4 likes
Be part of JetBrains PHPverse 2026 on June 9 – a free online event bringing PHP devs worldwide together.
Has anyone got Ziggy working with Inertia SSR and Vite?
I've got it working fine without trying to add ziggy, but when I try to start the SSR server after adding it, I get Error: Cannot find module 'ziggy'
My vite.config.ts and ssr.js are below:
// vite.config.ts
import { defineConfig } from 'vite'
import vue from '@vitejs/plugin-vue'
import laravel from 'vite-plugin-laravel'
import tailwindcss from 'tailwindcss'
import autoprefixer from 'autoprefixer'
import Components from 'unplugin-vue-components/vite'
import path from 'path'
export default defineConfig({
plugins: [
vue(),
laravel({
postcss: [autoprefixer(), tailwindcss()]
}),
Components({
dirs: ['resources/js']
})
],
resolve: {
alias: {
'ziggy': path.resolve(__dirname, 'vendor/tightenco/ziggy/src/js')
}
},
build: {
rollupOptions: {
external: 'ziggy'
}
}
})
// ssr.js
import { createSSRApp, h } from 'vue'
import { renderToString } from '@vue/server-renderer'
import { createInertiaApp } from '@inertiajs/inertia-vue3'
import createServer from '@inertiajs/server'
import route from 'ziggy'
let asyncViews = () => {
return import.meta.glob('./Pages/**/*.vue');
}
createServer((page) => createInertiaApp({
page,
render: renderToString,
resolve: async (name) => {
if (import.meta.env.DEV) {
return (await import(`./Pages/${name}.vue`)).default;
} else {
let pages = asyncViews();
const importPage = pages[`./Pages/${name}.vue`];
return importPage().then(module => module.default);
}
},
setup({ app, props, plugin }) {
const Ziggy = {
// Pull the Ziggy config off of the props.
...props.initialPage.props.ziggy,
// Build the location, since there is
// no window.location in Node.
location: new URL(props.initialPage.props.ziggy.url)
}
return createSSRApp({
render: () => h(app, props),
}).use(plugin)
.mixin({
methods: {
route: (name, params, absolute, config = Ziggy) => route(name, params, absolute, config),
},
})
},
}))
// package.json
"scripts": {
"dev": "vite",
"dev:ssr": "node public/build/ssr.js",
"development": "vite",
"build": "vite build",
"build:ssr": "vite build --ssr",
},
Try installing and using this instead of aliasing it from composer/vendor https://www.npmjs.com/package/ziggy-js
Please or to participate in this conversation.