我正在尝试将 sass/scss 支持添加到create-react-app。
所以我做了这些步骤：
npm ejectnpm install sass-loader node-sass --save-dev打开 webpack.config.dev.js 文件并将其添加到加载器部分：
{
test: /\.scss$/,
loaders: ["style", "css", "sass"]
},
在我的 app.js 文件中，我引用了一个 scss 文件：import './css/app.scss';
当我运行时，npm start一切都编译没有错误，但应用程序加载时没有样式。
我错过了什么？
我刚刚经历了这个，似乎有很多人迷路或找不到正确的答案。这就是我所做的：
npm run eject
运行此命令会将所有配置文件和传递依赖项（Webpack、Babel、ESLint 等）复制到您的项目中，正如您注意到的所有内容都在名为 react-script 的 npm 模块中。不要直接修改这个包！
npm install sass-loader node-sass --save-dev
此时，您必须安装 sass 编译器和 webpack 加载器作为开发依赖项。
config\webpack.config.dev.js.添加/\.scss$/,到 url 加载器中的 exclude 数组，更新后将如下所示：
exclude: [
/\.html$/,
/\.(js|jsx)$/,
/\.css$/,
/\.json$/,
/\.svg$/,
/\.scss$/, //Add this line
],
添加 SASS/SCSS 加载器：
{
test: /\.scss$/,
loaders: ['style', 'css', 'sass']
},
第1步：
npm run eject
现在配置文件将显示在项目文件夹中
第二步： 安装 sass 编译器和 webpack 加载器
npm install sass-loader node-sass --save-dev
在config\webpack.config.dev.js 添加/.scss$/到排除数组
第三步：在规则数组 中添加下面的加载器（应该在文件加载器之前添加）
{
test: /\.scss$/,
loaders: [
require.resolve('style-loader'),
require.resolve('css-loader'),
require.resolve('sass-loader')
]
}
并启动您的应用程序。
您可以将现有的 css 文件重命名为 scss 并工作
我在阅读它的文档时遇到了同样的问题。
Unitl 我发现使用 create-react-app 创建的项目中的 README.md 文件以另一种方式记录了它并且它有效。我认为依靠该自述文件（随您创建的项目附带）是更好的选择。
Koala是一个 sass、less 等编译器。为此，您可以使用您选择的任何工具。
将包含所有 SCSS 文件的源文件夹添加到 Koala。它将监视对您的 Sass 文件的任何修改并立即生成编译后的 CSS 版本。
直接在你的项目中使用 Koala 生成的 CSS 文件。
import './style.css';
{
test: /\.scss$/,
loaders: ['style', 'css', 'sass','scss'] //add 'scss'
},