Question

我正在创建一个create-react-app项目，我使用这些说明将SASS挂钩：https://github.com/facebook/create-react-app

然后，在我的源代码中，我创建了一个带有partials文件夹和index.scss的样式文件夹。在partials文件夹中，我有一个firstComponent.scss文件。我将scss从firstComponent文件导入到我的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; }

Answer 1

您将需要此行

需要（＆＃39; ./风格/ index.scss＆＃39）;

不是

import＆＃39; ./ style / index.scss＆＃39;;

SASS：index.js中导入的scss无法渲染（使用create-react-app）

1 个答案: