加入收藏 | 设为首页 | 会员中心 | 我要投稿 李大同 (https://www.lidatong.com.cn/)- 科技、建站、经验、云计算、5G、大数据,站长网!
当前位置: 首页 > 百科 > 正文

如何使create-react-app创建的react项目支持sass

发布时间:2020-12-15 06:31:16 所属栏目:百科 来源:网络整理
导读:前言 create-react-app 打包同样是用的 webpack ,所以使其支持 sass 其实是和我们自行初始化的项目一样的,只是 webpack 的配置文件所在目录不一样。所以只要找到配置文件所在的目录,然后按照一般 webpack 的配置方法配置就好。 下面是操作步骤 首先安装 s

前言

create-react-app打包同样是用的webpack,所以使其支持sass其实是和我们自行初始化的项目一样的,只是webpack的配置文件所在目录不一样。所以只要找到配置文件所在的目录,然后按照一般webpack的配置方法配置就好。

下面是操作步骤

首先安装sass-loadernode-sass两个依赖。

yarn add sass-loader node-sass

然后修改node_module文件夹下react-scripts里面关于webpack的配置文件

具体文件路径为: ./node_module/react-scripts/config/webpack.config.dev.js 注意:这是开发时的配置文件,打包还需要再配置webpack.config.prod.js文件

具体修改内容就是在配置文件里面添加:

{
    test: /.scss$/,use: [
      'style-loader','css-loader','sass-loader'
    ]
}

具体位置就是在css配置的下面

{
  test: /.css$/,....

以上就是使create-react-app支持sass最简单的配置方法了。

(编辑:李大同)

【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容!

    推荐文章
      热点阅读