1.项目准备
首先准备一张背景图,放置到src目录下的img中
修改以下css文件
js文件和上一篇文章一样,不需要进行修改
下载file-loader(npm install --save-dev file-loader)
2.修改配置文件
file-loader和css-loader一样,是一个loader,所以配置要在module的rules中配置:
其实file-loader总共干了两件事:
1.把本地的图片,复制一份,放到dist目录下的img目录中(目录结构是在loader的options参数中的name决定的)
2.把文件的路径换为正确的路径,写到css中
文件前的‘../’是在MiniCssExtractPlugin.loader这个loader中的publicPath参数中配置的。
展示成功