如何重用LESS文件中编写的样式在带Webpack的Angular 2应用程序中？
情景：
我希望有一个common.less文件，其中包含所有组件通用的样式/样式变量。 （例如：一些与主题相关的变量）
然后，我想在每个组件样式的文件中导入这个common.less文件，这样我就不必在那里重写这些常见的样式/样式变量。
我是Webpack用户。当我尝试这个时，我将common.less文件中的内容复制到所有特定于组件的样式文件（具有@import 'common.less'）中，这是低效的。
需要帮助才能正确完成此操作。提前感谢您的帮助。
答案 0 :(得分：3)
当你将.less文件加载到组件的样式中时 - 每个文件都是单独编译的，这是LESS（SASS）编译器的正常行为，当它从导入的文件渲染所有真正的类时，你无法改变它
所以，只有一种正确的方法可以避免它 - 将你的common.less文件拆分成几个文件，比如app.less和variables.less。应用程序样式只包含在根组件中（通常类似于＆＃39; app.component＆＃39;或其他），它包含所有常见类。
对于所有其他组件较少的文件，只导入variables.less - 包含ONLY变量和mixins的文件 - 它们不会是最终css的一部分，只是真正的渲染类而且它就是它
答案 1 :(得分：0)
使用@import (reference) "common.less";