在React中使用全局SASS变量迁移到样式化组件

我试图将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;

我是从错误的方式来处理这个问题吗？

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

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