我试图使用sass的@extend,这样我就不会将标记和html混合在一起了。正如在中所解释的。
总之,不要写
<div class="alert alert-primary>This is an alert!</div>
相反,你会写一些这样的东西
<div class="banner">This is an alert!</div>
.banner {
@extend .alert;
@extend .alert-primary;
}
这样,造型和内容就能很好地分开。
The problem:在使用we
是否有可能提早爆发或返回一个Sass混合器?我想做这样的事情:
@mixin foo($bar: false) {
@if $bar {
// return early without applying any of the styles below
}
color: red;
}
编辑:请记住,这个例子是我能想到的最简单的东西,说明了我的问题。在现实世界中,我的代码要复杂得多,而且用例也很清楚。
我开始使用Vue,使用Vue CLI模板。在该模板中,您将创建一个名为“vue.config.js”的文件来定义一些设置。在这里可以找到更多信息:
我为一个全局css/sass文件设置了一个设置,这样我的所有组件都可以访问变量(该文件只包含vars)。
vue.config.js:
module.exports = {
// So we can use the template syntages in vue components (correct me if am wrong)
runtimeCompiler: true,
// CSS settings
cs