问题
当在前端使用vue开发时，给特定页面做好了css并且通过import去导入到当前页面；在编译运行之后发现其他页面也受到影响更改了样式，即“全局污染”。文章来源：https://www.toymoban.com/news/detail-626583.html
污染方式
- 单组件污染
单个组件样式，影响到了其他的组件的样式。
单个组件污染的问题主要表现在< style>样式< /style>上不加 scoped;scoped的作用就是让样式只作用于当前组件，如果没有 scoped，那么样式就有可能影响其他组件。 - 多组件污染
多个组件在会共用一套CSS代码时，就会造成多组件污染的情况：<style scoped> @import "assets/css/common.css"; </style>
这种方式也会造成全局污染的情况；但是已经加了scoped，最后无效的原因是“@import”，原因如下：@import并不是直接引入css代码到页面，而是发起新的不带scoped的请求获得样式资源；因此，这种引用方式是全局的，从而引起全局污染。解决办法
在VUE中，页面是被允许添加多个Style、Script的，所以可以再添加一个Style通过src的方式去获取样式资源就能解决样式污染问题：文章来源地址https://www.toymoban.com/news/detail-626583.html
<style src="@/assets/css/yours.css" scoped> </style>
到了这里，关于Vue中引入外部css导致的全局污染的文章就介绍完了。如果您还想了解更多内容，请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章，希望大家以后多多支持TOY模板网！
