Vue.js style v-html with scoped css

I am using vue-loader 15.9.1. The >>> solution did not work for me (no effect) whereas the /deep/method resulted in building errors...

Here is what worked instead:

.foo ::v-deep .bar { color: red; }


AS Sarumanatee said if the accepted answer doesn't work try:

.foo /deep/ .bar { color: red; }

As stated in my answer here:

New version of vue-loader (from version 12.2.0) allows you to use "deep scoped" css. You need to use it that way:

<style scoped> now support "deep" selectors that can affect child components using the >>> combinator:

.foo >>> .bar { color: red; } will be compiled into:

.foo[data-v-xxxxxxx] .bar { color: red; }

More informations on the release page of vue-loader