Server and Client DOM Mismatch

[infostatus]

I'm trying to add Element-UI to the project. It renders in server but not the client side. On page refresh it will show from the server correctly rendered but when client version comes in, it gives the error and looses the style.

I've followed all steps saw in other projects:

• added element-ui dependency to [prod/server/package.json] and [src/package.json] files.
• added element-ui.js to the plugins folder
• add reference to the plugin in [nuxt.config.js]
• add css style to the layout

I've cloned the project with this changes here: https://github.com/infostatus/nuxt2-ssr-firebase-elementui

These are other projects where Nuxt and Element-ui work perfectly:

• https://github.com/nuxt-community/create-nuxt-app
• https://twitter.com/nuxt_js/status/814761953558204417?lang=en
• https://glitch.com/edit/#!/nuxt-element-ui?path=plugins/element-ui.js:1:0
• https://github.com/martinrisseeuw/element-ui-nuxt
• https://github.com/clarkdo/hare

What is missing? Been around this for some days now, trying all different things. Much appreciated for any help I can get.

Thank you so much for this helpful repository.

[infostatus]

UPDATE: The problem is something related to the Nuxt Plugins. I've added Bootstrap-vue as a Module in nuxt.config.js and everything worked as expected.

But when adding i18n as a plugin, it happens like ElementUI. The page is rendered in the server but not on the client side.

David Royer, be most grateful if you please help out

[infostatus]

Here's an example of the problem: https://paying-forward.firebaseapp.com/fr/about

For a split second it shows the server version correctly. But then it falls to the client version that has no access to the plugin.

What is missing?

[infostatus]

After more testing It happens with any plugin, it is rendered in the server but not on the client.

I've created a repository with a plugin for the Logo component.

Here's the source code: https://github.com/infostatus/nuxt2-ssr-firebase-plugins-issue

Clone, then run "yarn setup" and "yarn dev". The logo will show for a split second before error for not finding the component.

[infostatus]

Finally solved the problem. The nuxt folder is not being copied correctly: "copydist": "cp -R prod/server/nuxt/dist/ prod/client/assets"