SCSS 深度作用选择器 /deep/ 的问题

[pikou1995]

vue中的深度作用选择器

按习惯我是一直用/deep/来编写样式影响子组件的

<style lang="scss" scoped>
.container /deep/ .ant-input {
    border-radius: 4px;
}
</style>

但是node-sass已经deprecated了，所以拥抱dart-sass吧。

升级过程和要注意的事项 Node Sass to Dart Sass写的比较清楚。不兼容的就是需要把/deep/改成::v-deep。

sass-loader可以正确处理sass的node-sass，所以不用过多处理。

至于为什么dart-sass不支持/deep/，这里有个讨论，大概就是”sass不打算支持浏览器中不存在的选择组合器“。