在 Sass 中,:export 块用于将 Sass 变量导出到 JavaScript 中,使得这些变量可以在 JS 中被访问和使用。这种功能在构建现代前端应用时非常有用,特别是在需要共享样式和逻辑的情况下。
$secondary-color: #2ecc71;
$font-size-base: 16px;
:export {
primaryColor: $primary-color;
secondaryColor: $secondary-color;
fontSizeBase: $font-size-base;
}
console.log(styles.primaryColor); // 输出: #3498db
console.log(styles.secondaryColor); // 输出: #2ecc71
console.log(styles.fontSizeBase); // 输出: 16px
通过配置 sass-loader 并在 JavaScript 中导入相应的样式文件,可以方便地访问和使用这些导出的变量。