我正在开发一个 create-react-app 元素,我使用以下说明将 SASS 连接到该元素:https://github.com/facebook/create-react-app
然后,在我的源代码中,我创建了一个带有 partials 文件夹和 index.scss 的样式文件夹。在 partials 文件夹中,我有一个 firstComponent.scss 文件。我将 firstComponent 文件中的 scss 导入到我的 index.scss 中。样式已成功导入到我的 index.css 文件中。但是,它们不会在浏览器上呈现。为什么是这样?
这是我的 index.js
import React from 'react';
import ReactDOM from 'react-dom';
import App from './App';
import registerServiceWorker from './registerServiceWorker';
import './style/index.scss';
ReactDOM.render(<App />, document.getElementById('root'));
registerServiceWorker();
这是我的 index.scss
@import './partials/_firstComponent';
body {
margin: 0;
padding: 0;
font-family: sans-serif;
}
这是我的 firstComponent.scss
.firstComponent {
background-color: 'red';
}
这是我的 index.css
.firstComponent {
background-color: 'red'; }
body {
margin: 0;
padding: 0;
font-family: sans-serif; }
最佳答案
您将需要这一行
require('./style/index.scss');
不
导入'./style/index.scss';
关于css - SASS:在 index.js 中导入的 scss 不呈现(使用 create-react-app),我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/49136815/