vue css权值问题

Question

我直接在main.js import一个css文件，我想做的是把所有media查询的样式都写在这里，但是发现并没有效果，这个css并不是权值最高的，尽管我放到最了最后的位置。。所以说如何处理权值和覆写这些问题？

Answer 1

.vue文件中 如果style标签开启了scoped开关，页面渲染后的class就会出现.synergy[data-v-2462f4fe]的样子。
相比较.synergy有较高的权重

处理的方法是不开启scoped开关，但是需要对整个项目的开发制定一个规范

Answer 2

每个vue组件内自己定义的css是权值最高的，组件内的css如果有重名，就有可能会污染全局css，为了避免被污染可以在style标签上加scoped标签限制作用域……

当然scoped并不是万能的，这个其实仍然是css设计有问题，在写css的时候，应该避免相互不影响（不论引入样式的顺序先后）

Answer 3

如果你的组件内有重复的css希望提高权重，
你你可以在这个组件的 template 的跟节点 加一个class="classname"然后用

.classname .css{

}

这样重名的css在组件内的权重就最高了

Answer 4

记笔记记笔记