如何避免Vue引入CSS文件导致的全局样式污染问题？

本文共计491个文字，预计阅读时间需要2分钟。

目录 + 引入CSS文件导致全局污染 + Vue避免全局样式污染的正确做法 + 解决方案 + 引入CSS文件导致全局污染

1.在单组件的style中写CSS样式，如果标签内不加scoped可能影响其他组件的样式 + st

目录

• 引入css文件导致全局污染
• vue避免全局样式污染的正确做法
• 解决方案

引入css文件导致全局污染

1.写在单组件的style里面css样式，如果标签内不加scoped可能会影响其他组件的样式

<style scoped></style>

2.通过import引入的外部css文件，这种引入方式是全局的，也会影响其他组件的页面样式

所以可以通过一下方法引入，则不会影响其他组件的页面样式

<style src="文件路径"></style>

vue避免全局样式污染的正确做法

说明问题：

样式全局污染产生的bug，会影响到其他页面原有的样式，导致每个页面的样式互相冲突，如果写的代码造成了全局样式污染，导致别人的页面每个地方都要去写自定义页面的代码，导致工作量巨大，严重的话，领导会让你当场辞职。