create-react-app React脚手架 引入 scss 配置

react

1. 配置sass需要按以下步骤进行:

 一、安装sass-loader和node-sass依赖

npm install sass-loader node-sass --save-dev

二、打开react的webpack配置

React提供的脚手架create-react-app创建的工程文件不像vue那种暴露出webpack来的配置,所以你要去

找到  node_modules/react-scripts/config/webpack.config.dev.js 文件和 webpack.config.prod.js 文件

将module配置项的最后一项配置后面添加如下

两个文件都要加。

{

    test:/\.scss$/,

    loaders:['style-loader','css-loader','sass-loader']

}

看图片 

一个在 loader: require.resolve('file-loader')  前面加

一个在最后加

哪用哪引入scss 即可

import  ' style.scss ( 导入你创建的 scss路径)'

配置好了,记得重新启动运行

以上是 create-react-app React脚手架 引入 scss 配置 的全部内容, 来源链接: utcz.com/z/384244.html

回到顶部