webpack报错You may need an appropriate loader to handle this file type

今天尝试用css作为webpack入口时碰到问题，复现如下：

代码结构

在webpack.config.js中将入口设置为main.css

在webpack.config.js中配置rules，加入style-loader和 css-loader

执行 npm install css-loader style-loader --save-dev

执行npx webpack打包，页面仍然报错

报错信息

查看node_modules中loader安装成功，反复确认拼写没错。

。。。。。。。奇怪的分割线 。。。。。。。

最后发现问题居然是在webpack.config.js配置中，test顺手打了双引号导致无法将css和对应的loader成功关联。

错误定位

正确如下：

正确做法

修改完毕，正确打包。。。