nuxt3 在使用naive-ui , 每次刷新都会闪烁,布局错乱解决
在plugins/naive-ui.ts 加入下列代码, 就能避免闪烁,完美运行。
·
参考github, https://github.com/07akioni/css-render/issues/1108
在plugins/naive-ui.ts 加入下列代码, 就能避免闪烁,完美运行
mport { setup } from '@css-render/vue3-ssr'
export default defineNuxtPlugin((nuxtApp) => {
const { collect } = setup(nuxtApp.vueApp)
useServerHead({
style: () => {
const stylesString = collect()
const stylesArray = stylesString.split(/<\/style>/g).filter(style => style)
return stylesArray.map((styleString: string) => {
const match = styleString.match(/<style cssr-id="([^"]*)">([\s\S]*)/)
if (match) {
const id = match[1]
return { 'cssr-id': id, children: match[2] }
}
return {}
})
}
})
})更多推荐



所有评论(0)