所以,我在Vue.js中读到了here,您可以在 Select 器中使用/deep/
或>>>
,以便创建应用于子组件内的元素的样式规则.但是,试图在我的样式中使用它,无论是在SCSS中还是在普通的旧CSS中,都不起作用.相反,它们被逐字发送到浏览器,因此没有任何效果.例如:
home.vue:
<style lang="css" scoped>
.autocomplete >>> .autocomplete-input
{
// ...
}
</style>
generated css:个
<style type="text/css">
.autocomplete >>> .autocomplete-input[data-v-2bda0c9a]
{
//...
}
</style>
what I want:个
<style type="text/css">
.autocomplete[data-v-2bda0c9a] .autocomplete-input
{
//...
}
</style>
我的webpack配置与vue-loader
相关,如下所示:
// ...
{
test: /\.vue$/,
loader: "vue-loader",
options: {
loaders: {
scss: "vue-style-loader!css-loader!sass-loader"
}
}
}
// ...
所以我的问题是,我怎么才能让这个>>>
接线员正常工作呢?
我已经找到了this个答案,但我正是这么做的,它不起作用...