模块化结构

大型项目中，合理拆分和组织样式文件非常重要。Sass 提供了模块化机制，支持将样式拆分成多个部分，然后在主文件中导入，便于管理和复用。

---

1. 分文件编写

一般将样式拆分为：

• _variables.scss — 存放变量
• _mixins.scss — 存放混入（Mixin）
• _base.scss — 基础样式
• _layout.scss — 布局样式
• _components.scss — 组件样式

文件名前加下划线 _，表示是部分文件（partial），不会被单独编译。

---

2. 导入模块

使用 @import（旧方法）

@import "variables";
@import "mixins";
@import "base";
@import "layout";
@import "components";

使用 @use（推荐）

@use "variables";
@use "mixins";
@use "base";
@use "layout";
@use "components";

@use 会启用命名空间，避免命名冲突。

模块化结构示例

示例无法以 iframe 加载（请检查路径或将 demo 放到 public/）。