时间戳

首页 > 解决方案 > 为什么 css 选择器会重复？(SCSS)

javascript - 为什么 css 选择器会重复？(SCSS)

问题描述

我有一个 .scss 文件在其他 .scss 文件中连接了 4 次，为什么这个文件的内容 4 次包含在 bundle.css 中？如何解决这个问题呢？

文件_1.scss：

.header_video_titles {
    margin-top: 10%;
}

文件_2.scss、文件_3.scss、文件_4.scss：

@import "file_1.scss"

因此，bundle.css 包含：

.header_video_titles {
    margin-top: 10%;
}
.header_video_titles {
    margin-top: 10%;
}
.header_video_titles {
    margin-top: 10%;
}
.header_video_titles {
    margin-top: 10%;
}

标签： javascriptwebpacksass

解决方案

发生这种情况是因为当您运行导入时，所有 css 内容都被复制到新文件中，因为最后全部编译为 1，原始代码与其他代码组合在一起导致重复代码。

推荐阅读