自己搭建的react项目引入scss或css

 

react、webpack、bebal7搭建项目参考我的上一篇博客

https://blog.csdn.net/qq_39501040/article/details/102921945

在搭建完成react项目后，在开发过程中引入css或scss时出现报错，无法解析css或scss文件内容

解决方法如下：

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

安装这些依赖的目的是为了webpack打包时能将css进行打包

安装过后需要修改webpack.config.js，在module下的rules中加入以下内容

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

这种情况下，在运行时就可以解析css文件了

但是。。。这时css文件的内容时在html页面的head标签下的