-
After upgrading
I had the following code in this code section: import { routes } from 'vue-router/auto-routes';
import { setupLayouts } from 'virtual:generated-layouts';
console.log('routes', routes); // routes undefined
// ...
// 97 line
const routesWithLayouts = setupLayouts(routes); I am using the following Vite configuration: import { defineConfig } from 'vite';
import vuePlugin from '@vitejs/plugin-vue';
import layoutsPlugin from 'vite-plugin-vue-layouts';
import vueRouterPlugin from 'unplugin-vue-router/vite';
import { getFileBasedRouteName } from 'unplugin-vue-router';
export default defineConfig({
plugins: [
vueRouterPlugin({
dts: './src/typed-router.d.ts',
getRouteName: (node) => {
let routeName = getFileBasedRouteName(node).substring(1);
if (routeName === '') {
return 'index';
}
if (routeName.at(-1) === '/') {
routeName = routeName.substring(0, routeName.length - 1);
}
if (node.children.size !== 0) {
routeName += '-root';
}
return routeName
.replace(/\[|\]/g, '')
.replace(/\//g, '-');
},
routesFolder: {
src: 'src',
filePatterns: 'pages/**/*',
path: (file) => {
const sourceDir = file.substring(file.lastIndexOf('src/') + 5);
return sourceDir.substring(sourceDir.indexOf('pages') + 6);
},
}
}),
vuePlugin(),
layoutsPlugin({
importMode: () => 'sync',
layoutsDirs: [
'src/layouts'
],
})
]
}); Adding |
Beta Was this translation helpful? Give feedback.
Replies: 4 comments 4 replies
-
Can you reproduce without the other plugins? Did you follow the migration steps in the changelog? |
Beta Was this translation helpful? Give feedback.
-
After a bit of debugging I realized that it was broken in SSR. When I tried to open the application as SPA, all the routers were in place. I've done all the changelog steps and also looked at diff versions, but I still don't understand what's going wrong. |
Beta Was this translation helpful? Give feedback.
-
I see. I haven’t found any issue about using this with SSR so I will move this to a discussion until a boiled down reproduction is provided |
Beta Was this translation helpful? Give feedback.
-
Hi! @negezor, try to use import { defineConfig } from 'vite'
import Vue from '@vitejs/plugin-vue'
import VueRouter from 'unplugin-vue-router/vite'
export default ({ mode }) => {
return defineConfig({
ssr: {
noExternal: mode === 'development' ? ['vue-router'] : []
},
plugins: [
VueRouter(),
Vue()
]
})
} |
Beta Was this translation helpful? Give feedback.
Hi!
@negezor, try to use
ssr.noExternal
option for development mode in defineConfig: