我可以用@import拿走我想要的东西，然后丢弃其余的吗?

Question

假设我正在使用 SANSS，我想大量借鉴一些现有的样式表，无论是另一个 SASS 样式表还是 CSS 样式表。我可以@import另一张表，然后使用@extend来使用它的一些规则。是否有一个选项可以从生成的 CSS 中排除我没有使用的所有其他内容？

Answer 1

@import采用整个样式表/部分并将其放入样式表中，除了将它们全部覆盖为默认值之外，没有办法排除任何规则。如果你有一个原始的 SASS 文件，你可以将它们全部抽象成部分，然后将你需要的东西@import到你的新文件中。

Answer 2

无法

导入另一个 sass 文件，以便在不呈现内容的情况下可以使用@extends。如果不是这样渲染，则创建并导入部分完整的%placeholders以使用没有渲染内容的@extend将是一个不错的选择：

_import.scss

%button {
    color: #fff;
    width: 72px;
    height: 24px;
}

主.scss

@import "import";
.button-blue {
@extend %button;
background-color: blue;
}

主.css

.button-blue {
  color: #
  width: 72px;
  height: 24px; }
.button-blue {
  border: 1px solid #fff; }

所以我认为实现你目标的最好方法是在你的风格中导入一些混合的部分，我已经使用 sass 半年了，到目前为止我还不需要导入@extends所以请告诉我你想用@extend做什么，我会尽力帮助你用@mixin