vue组件 样式冲突_Vue项目样式穿透（less版+scss版）

在vue项目中，经常会修改第三方组件库的样式，最简单的方法就是直接在全局样式表里进行覆盖。 但这样会让全局样式表很难维护，而且极易造成全局样式冲突。 想要在scoped的样式表中覆盖，又行不通， 因为编译出来的样式选择器，在最后一级上都加上了属性！ 而我们要覆盖的组件内部结构标签上并没有属性。 而样式穿透技术就是专门解决这种问题的。 以前在项目中尝试过，当时试了半天，完全没有效果。 时隔半年，再次技术攻关，摸清了其中的规律。 网上一般会给出以下三种样式穿透符号：

>>>      /deep/     ::v-deep

经过反复尝试，发现 less中只能用 /deep/ 穿透。 scss中只能用 ::v-deep 穿透。 Less中，使用 /deep/ 穿透有以下 两种固定写法，其余写法不管用！

.wrap {
      /deep/.inner {
        color: red;  }}.wrap /deep/ .inner {
      c