vue中如何更改第三方UI库的样式？

在vue项目中，一般会使用第三方UI库。例如elementUI、vant、mint等。
往往需要改写样式来满足公司内部UI设计。很多时候，会产生各种各样的问题。污染全局样式等。vue文件中样式都是模块化的。只做用于当前作用域。
vue中 scoped的原理分析。
在浏览器开发者工具下我们可以看到，页面中元素都带有一个data-v-2df2d1234这一长串自定义属性。样式中会有对应的匹配。这是vue-loader处理后的东西。用来保证样式不会造成全局污染。当我们的组件中引入第三方UI库的组件并修改样式不生效时可能就是scoped的关系。
方法一、
分析element代码结构可以看出来端倪。在我们的样式前加上/deep/可以把自定义属性提升到父元素上，可以解决样式不生效的问题。
方法二、
在.vue文件后追加

<style>
	修改样式的代码
</style>

方法三、
在外层dom结构上增加额外的class。

最好的方式是方法三，/deep/这种写法影响性能，强烈不推荐。方法二会带来污染全局的问题。