使用 Inertia Vue3 进行服务端渲染时应注意:
- 按照 官方文档 说明配置前后端;
resources/js/app.js
和resources/js/ssr.js
写法一致,ssr.js
中不需要引入服务端用不到的代码,比如进度条@inertiajs/progress
;但其他如 resolve 按名称解析 Inertia 组件部分以及路由库 Ziggy 写法均需要一致;- Vue 单文件组件不要写
<style></style>
代码块部分(即时里面的样式代码为空),它会在 document 中插入对应的样式代码,在服务端中 window 和 (window.)document 均不存在,因此会报错。直接将其编译为 CSS 文件在页面头部中引入即可; - 如果使用软链接引入 Vue 组件或库,需要在 mix webpack 配置项中添加
symlinks: false
:mix.webpackConfig({ resolve: { symlinks: false, // 解决使用软链接引入时报错 } })