怎样使create-react-app建立的react项目支撑sass

媒介

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最简朴的设置要领了。

    原文作者:IamDLY
    原文地址: https://segmentfault.com/a/1190000013987785
    本文转自网络文章,转载此文章仅为分享知识,如有侵权,请联系博主进行删除。
点赞