reactjs - 在 React 中迁移到具有全局 SASS 变量的样式组件

Question

我正在尝试慢慢地将 Styled-Components 引入到我现有的代码库中，该代码库严重依赖于全局 SASS 变量(部分导入到 main.scss 中)。

如何引用 SCSS 变量？以下不起作用:

import React from 'react';
import styled from 'styled-components';

const Button = styled.button`
  background-color: $color-blue;
`;

export default Button;

我是否以错误的方式处理这个问题？

Answer 1

我写了一篇关于解决这个问题的文章。 https://medium.com/styled-components/getting-sassy-with-sass-styled-theme-9a375cfb78e8

本质上，您可以使用优秀的sass-extract图书馆以及 sass-extract-loader和 sass-extract-js插件将全局 Sass 变量作为主题对象引入您的应用程序。