问题产生:我们想要像处理js模块一样处理css,但是webpack在处理css的时候,会像处理js一样处理css,这样根本不能正确的打包css文件,这个时候我们需要一些专门处理css的loader来在处理css。

一、css-loader

1.1 安装css-loader

image.png

1.2 配置文件使得对于以css结尾的文件进行处理

image.png

1.3 由于在css文件中,可能会引入一些图片,所以需要file-loader

1.4 进行打包即可

二、style-loader

首先,style-loader是在css-loader的基础上面进行的对于处理后的字符串进行处理(因为css-loader仅仅是将css转化为字符串,并没有引入到index。html中去,所以需要style来进行后续处理)