vue 项目写css放在同一个文件还是分散在各个单文件里写好?

Question

vue 项目写css放在同一个文件还是分散在各个单文件里写好?项目采用的是sass。

考虑到项目合作，我现在的打算是 一个公用的scss文件（包含变量和mixin，%），各个单文件引入这个公用scss文件（多次引入这个scss文件也不会多次生成重复样式），然后在各个单文件里写样式。请问这样可以吗？有更好的建议吗？谢谢！

Answer 1

看项目情况。如果样式文件太长，建议分开成独立文件。不多就放在同一个文件。

Answer 2

个人习惯：一般的中小组件、有可能到处被调用的、css代码量不多的，就基本把template/js/css写在一个.vue文件里。

Answer 3

因为webpack有插件会把vue文件里的css单独成一个个的<style></style>，所以我从此只写在css文件中（尽管后来我会配置webpack的相关插件了）。至于是分开几个css文件还是写在一个文件里，问题倒不大，不过考虑到维护，找起来方便，可以考虑划分成若干个。

Answer 4

程序规模小->单一文件
程序规模大->多个文件

原因：当样式文件超过200行时，您就慢慢步入修仙模式了