vue 深度选择器前世今生

node-sass 不支持 >>> 语法，推荐改用 /deep/。后来，node-sass 被 deprecated，推荐使用 dart-sass。但 dart-sass 又和 /deep/ 有冲突。所以，如果你使用 vue2 同时又使用 dart-sass，只剩一种选择 ::v-deep。

<style scoped>
.a ::v-deep .b {
  /* ... */
}
</style>

现在，你通过 npm i sass 命令安装的默认就是 dart-sass。

在 vue3 中，::v-deep 写法又被抛弃了，改用 :deep()。

<style scoped>
.a :deep(.b) {
  /* ... */
}
</style>

参考资料

• https://sass-lang.com/blog/libsass-is-deprecated
• https://github.com/vuejs/rfcs/blob/master/active-rfcs/0023-scoped-styles-changes.md