Styles are ignored in .vue files from node_modules

[prograhammer]

When importing vue components from vendors (.vue files residing in node_modules) the styles from style blocks in those .vue files are not being processed by vue-loader. They don't appear anywhere after building. The styles don't appear in the browser when running the dev server npm run dev. And they don't show up anywhere in any build output in /dist from npm run build. You can quickly try it yourself and see it doesn't work.

I simply ran the vue-cli on this template and imported the vendor component in the App.vue. I didn't touch any webpack config or anything. Am I misunderstanding something about how vue-loader works?

[LinusBorg]

You can quickly try it yourself and see it doesn't work.

Please at least name the package that you loaded the .vue file in question from, as well as the file itself.

Because I haven't come across such a problem yet, and the vue-loader config does not exclude node_modules (which the config for babel-loader does, for example), so it should work.

[prograhammer]

Oh stupid me, I was extracting the css in the vendor vue component I imported, so of course it wasn't there. So I stopped extracting it in the vendor package and now the css is stuck in the vendor.[hash].js file and is not being included in the parent project's app.[hash].css.

[prograhammer]

^ this is probably more ideal though, when thinking about caching. Since likely vendor styles would change less and you don't want that included in your app.[hash].css file which will get rehashed more often. But how would one go about extracting the styles from the vendor js bundle? It seems the ExtractTextPlugin can't catch the chunks created implicitly from the minChunks function of CommonChunkPlugin as you can see here.

[bartcorremans]

In my setup I changed the minChunks regex to the following (less optional):

/\.(js|vue|css|less)$/

This works pretty well for extracting CSS both from third-party .vue files and from standalone CSS files that you require().

[LinusBorg]

Seems like this is resolved and can be closed, great!