尽管 CSS 提供了 import 命令支持文件引用，但由于其存在一些问题（比如影响浏览器并行下载、加载顺序错乱等）导致使用率极低。更常见的做法是通过预处理器或编译工具插件来引入样式文件。
将样式文件进行分类，把相关的文件放在一起，让工程师在修改样式的时候更容易找到对应的样式文件，在创建样式文件的时候更容易找到对应的目录。管理样式文件的目的就是为了让开发人员更方便地维护代码。
一、开源项目中的样式文件
先来看看著名的 UI 相关的开源项目是怎么管理样式文件的。
（1）Bootstrap：https://github.com/twbs/bootstrap/tree/main 可以看出项目使用的是 Sass 预处理器。
该目录包括了 5 个目录、组件样式文件和一些全局样式。再来分析下目录及内容：
- forms/，表单组件相关样式；
- helpers/，公共样式，包括定位、清除等；
- mixins/，可以理解为生成最终样式的函数；
- utilities/，媒体查询相关样式；
- vendor/，依赖的外部第三方样式。
根目录存放了组件样式文件和目录，其他样式文件放在不同的目录中。目录中的文件分类清晰，但目录结构相对于大多数实际项目而