Sass в модуле компонентов не импортируется - PullRequest
0 голосов
/ 03 октября 2018

У меня проблемы с применением sass-стилей.

У меня есть компоненты, определенные в библиотеке components.Эти компоненты импортируют стиль sass.Приложение-потребитель импортирует компоненты, и мы можем отобразить компоненты, но стили sass не применяются.

Например, в этом случае стили из Button.scss не применяются, а из App.scss are.

// /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 используются style-loader, css-loader, postcss-loader и sass-loader.components использует только css-loader, postcss-loader и sass-loader.

Моя интуиция заключается в том, что когда another-app импортирует Button из components, он будет использовать style-loader для захватаButton.scss и добавьте это как <style/> в DOM, как это делает для App.scss.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...