LESS CSS语句@import-once的作用是什么？

@import-once 是 LESS CSS 中的一个指令，其主要作用是确保在 LESS 文件中某个文件只被导入一次，即使在代码中多次使用 @import 导入相同的文件。这有助于避免重复导入造成的样式冲突和提高编译效率。

例如，假设你有一个通用的样式文件 variables.less，其中定义了多个全站共用的变量和样式。在一个大型项目中，可能有多个 LESS 文件需要使用这些变量和样式。如果使用普通的 @import 指令，每次引用 variables.less 时，它的内容都会被重复加载和处理，这会导致最终生成的 CSS 文件中出现重复的样式定义，从而增加输出文件的大小，也可能导致样式应用上的错误。

通过使用 @import-once，你可以确保 variables.less 在整个样式表中只被加载一次，无论它被引用多少次，从而有效管理项目的样式依赖和输出效率。这在大型项目中特别有用，可以显著优化项目的构建时间和最终产物的质量。

less
// 在 main.less 中
@import-once "variables.less";
@import-once "mixins.less";

// 其他样式代码...

在上述例子中，无论 variables.less 和 mixins.less 在其他文件中是否被再次引用，它们各自只会被导入一次，确保了样式定义的唯一性和整体项目的编译性能。