SSR "context.styles" is not defined on webpack 4 #11794

dszymon · 2020-11-26T19:01:20Z

Version

2.5.22

Reproduction link

https://github.com/Szymon-D/VueSsrStylesReproduction

Steps to reproduce

Clone the repository
Run npm install
Run npm run build
Run npm start
Open http://localhost:8080
Check head tag, there are no inline styles from the current route

What is expected?

There should be style tags with data-vue-ssr-id attribute

What is actually happening?

Output includes only link tags to external CSS files

The issue is related to replacement of extract-text-webpack-plugin with extract-css-chunks-webpack-plugin.
It seems that with newer plugins, vue-style-loader doesn't get called in all cases where it would as the value of the fallback option to the legacy plugin.
There is no styles field on the context after rendering the app, as you can see here

vue/packages/vue-server-renderer/build.dev.js

Line 9397 in 4f81b5d

Object.defineProperty(userContext, 'styles', {

it's defined only in case if there's a _renderStyles function, which comes from the vue-style-loader
https://github.com/vuejs/vue-style-loader/blob/477c25e1a506c54e18cb443f7981aed6d4e80e65/lib/addStylesServer.js#L16

The text was updated successfully, but these errors were encountered:

dszymon changed the title ~~"context.styles" is not defined on webpack 4~~ SSR "context.styles" is not defined on webpack 4 Nov 26, 2020

SSR "context.styles" is not defined on webpack 4 #11794

SSR "context.styles" is not defined on webpack 4 #11794

Comments

dszymon commented Nov 26, 2020 • edited

Version

Reproduction link

Steps to reproduce

What is expected?

What is actually happening?

dszymon commented Nov 26, 2020 •

edited