npm - 我如何使用全局 scss 变量覆盖我的节点模块

Question

我创建了一个个人 UI 框架(react-components)，并希望与我的一些项目共享该框架。

为了良好的管理，我想在 NPM 上上传我的框架。

我在我的框架中使用了 SCSS，该框架由一个全局 SCSS 变量文件组成。
如果我想为每个项目使用不同的全局变量值，我将如何处理？我想从 node-modules 文件夹中设置我的全局变量文件。

这会影响从 node-modules 文件夹中进入 node-module 的全局变量吗？

任何解决方案将不胜感激。

Answer 1

SCSS 允许您为变量定义默认值，这些值可以被否决。

项目中的示例文件 app.scss

$some_color: blue;
@import 'node_modules/yourframework/main'; // This is your frameworks main file

框架中的示例文件 node_modules/yourframework/main.scss

$some_color: red !default;
body{
   background-color: $some_color;
}

这将导致您 body 的背景为蓝色。

祝你好运!