如何将我的Sass变量分配给所有React组件?

时间:2018-12-28 19:20:42

标签: reactjs sass

我正在尝试将 _variables.scss 导入到我的根样式中,以使所有样式都包含在我的所有组件中。检查

/*Importing my lib styles*/
@import "./libs/_variables.scss";

body {
  margin: 0;
  font-family: Helvetica, Arial, sans-serif;
}

@import "./pages/login/components/header/Header";

但是显示此错误。

Error: Undefined variable: "$primary-color".
        on line 2 of src/pages/login/components/header/Header.scss
>>   background-color: $primary-color;
   --------------------^

2 个答案:

答案 0 :(得分:1)

尝试在Header.scss内导入_variables.scss

答案 1 :(得分:0)

一种实现方法只是从根目录index.scss中导入任何scss文件

所以不要放置导入'./Header.scss';在Header.js中 你有

@import "./_variables.scss";
@import "./components/Header/Header.scss";

在index.scss

并在index.js中导入“ ./index.scss”