Answer the question
In order to leave comments, you need to log in
The client-side rendered virtual DOM tree is not matching server-rendered content... What could be causing the error?
Good afternoon.
I hosted the project ssr - vue.js.
When I open the site in the browser, I get such an error.
Vue warn]: The client-side rendered virtual DOM tree is not matching server-rendered content. This is likely caused by incorrect HTML markup, for example nesting block-level elements inside , or missing . Bailing hydration and performing full client-side render.
This is the entry point to the client
entry-client.js
import { createApp } from './app'
import Vue from 'vue'
const { app, router, store } = createApp()
import { screenControl } from "./util/resize.js"
import { mouseControl } from "./util/mouse.js"
import { keysControl } from "./util/keys.js"
import firebase from 'firebase'
import { config } from './config/firebaseConfig.js'
import { auth } from "./util/auth.js"
firebase.initializeApp(config)
if (window.__INITIAL_STATE__) {
store.replaceState(window.__INITIAL_STATE__)
}
screenControl.set(app.$store)
screenControl.event(app.$store)
mouseControl.scroll(app.$store)
mouseControl.coordinates(app.$store)
keysControl.event(app.$store)
app.$store.commit( 'sysWindowLoaded', true )
auth.changeState(app.$store, this)
Vue.mixin({
beforeRouteUpdate (to, from, next) {
const { asyncData } = this.$options
if (asyncData) {
asyncData({
store: this.$store,
route: to
}).then(next).catch(next)
} else {
next()
}
}
})
router.onReady(() => {
router.beforeResolve((to, from, next) => {
const componentsMatched = router.getMatchedComponents(to)
const componentsPrevMatched = router.getMatchedComponents(from)
let diffed = false
const activated = componentsMatched.filter((c, i) => {
return diffed || (diffed = (componentsPrevMatched[i] !== c))
})
if (!activated.length) {
return next()
}
Promise.all(activated.map(c => {
if (c.asyncData) {
return c.asyncData({ store, route: to })
}
}))
.then(() => {
next()
})
.catch(next)
})
app.$mount('#app')
})
Answer the question
In order to leave comments, you need to log in
Didn't find what you were looking for?
Ask your questionAsk a Question
731 491 924 answers to any question