我无法应用sass样式 .

我在 components 库中定义了组件 . 这些组件导入sass样式 . 消费应用程序导入组件，我们可以渲染组件，但不应用sass样式 .

例如，在这种情况下， Button.scss 中的样式未应用，但来自 App.scss 的样式是 .

// /components/Button/Button.scss
.my-button {
  color: red;
}


// /components/Button/Button.js
import * as React from 'react';

import './Button.scss';

export const Button = ({ children }) => <button className='my-button'>{children}</button>


// /another-app/App/App.js
import * as React from 'react';
import { Button } from 'components';
import './App.scss';

export const App = () => <div><Button>Hello World</Button></div>

我检查了webpack为组件输出的构建 . 它正确解析了sass变量并添加了css字符串 . another-app 的webpack使用样式加载器，css-loader，postcss-loader和sass-loader . components 仅使用css-loader，postcss-loader和sass-loader .

我的直觉是当 another-app 从 components 导入 Button 时，它会使用style-loader来获取 Button.scss 并将其作为 <style/> 添加到DOM中，就像 App.scss 一样 .

css reactjs webpack sass