scss中的Blueprint.js动态$ns变量

Question

我使用的是Blueprint.js v3.x，并且一直在使用SASS变量。我想利用$ns变量，但我的应用程序处于黑暗模式。$ns变量在上面文件的第10行被设置为bp3 !default;，据我所知，这意味着我可以在app.scss中将其设置为不同的值。那么，只设置$ns: bp3-dark;并以这种方式使用这个变量就可以了。然而，在未来我想支持暗/亮模式开关；根据最佳实践，我如何根据所述开关将$ns动态设置为正确的值？

Answer 1

经过进一步考虑，我似乎并不完全清楚为什么存在$ns变量的基本原理：与其试图用它来参考应用程序是处于黑暗模式还是明亮模式，不如这样使用它(SCSS(：

.app {
.#{$ns}-dark {
/* set the background color, any other required setup */
...
& .my-button-group.#{$ns}-button-group {
/* override anything you might want for the element.bp3-button-group
}
}
}

从本质上讲，$ns变量用于指向bp3，以便将来对SASS进行验证。将其更改为bp3-dark或任何其他值都无法达到此目的。