如何让 scss 与 React 项目一起工作? [英] How do I get scss working with a react project?

问题描述

几天来，我一直在尝试使用 react-create-app 或我自己的以某种方式集成 scss 的 webpack 配置来设置 React 项目.我总是对 wepack 遇到一些奇怪的依赖问题(找不到正确的版本，无论是 2.2.1 还是 1.4.1).有没有人知道我将如何做这件事?

For days I've been trying to set up a react project wether with react-create-app or my own webpack configuration that integrates scss in some way. I always get some weird dependency issue with wepack (can't find right version whether it be 2.2.1 or 1.4.1). Does anyone have an idea about how I would go about doing this?

推荐答案

我就是这样做的

package.json 依赖项:

package.json dependencies :

"css-loader": "^0.26.1",
"node-sass": "^4.4.0",
"sass-loader": "^4.1.1"

(或任何最新版本)

webpack.config.js 模块加载器:

webpack.config.js module loaders :

{ 
    test: /\.scss$/, 
    loader: 'style-loader!css-loader!sass-loader'
}

在您的代码中(如果可能，在根文件中)

inside your code (root file if possible)

import './<your style path>/<your style file>.scss'

这篇关于如何让 scss 与 React 项目一起工作?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！