我之前在Spring Boot项目里也碰到过类似的问题，折腾了一会儿终于搞定了，给你分享下具体的解决步骤：

一、先修复CSS文件被识别成文件夹/包的问题 #

这个问题大概率是IntelliJ的文件类型关联出了差错，导致它把.css后缀的文件误判成了目录结构。按下面的步骤调整：

• 打开IntelliJ的设置（快捷键Ctrl+Alt+S，Mac用Cmd+,）
• 导航到Editor > File Types选项
• 在上方的Recognized File Types列表里找到CSS，然后看下方的Registered Patterns，确认有没有*.css。如果没有，点击+按钮添加这个规则；如果有，检查其他文件类型（比如Text或者自定义类型）有没有错误包含*.css，有的话选中它点-移除
• 点击Apply和OK，然后右键项目根目录选择Reload from Disk，或者直接重启IDE，应该就能看到CSS文件恢复正常显示了

二、让Source Map文件和CSS同层级并被正确识别 #

解决了CSS的问题后，接下来处理.map文件的识别：

• 先保证命名对应：比如你的CSS文件是style.css，对应的Source Map必须命名为style.css.map，这样IDE和浏览器才能自动关联两者
• 配置IDE识别.map文件：
  同样打开Settings > Editor > File Types，找到Source Map类型（如果找不到，就点击左上角的+新建一个，命名为Source Map，然后添加*.map作为注册模式）
  确认*.map没有被其他文件类型占用，要是有的话就移除掉
• 调整项目视图显示：
  在Project视图的右上角点那个齿轮图标，确保Show Excluded Files是勾选的（防止.map文件被误排除），同时可以取消Compact Packages的勾选，避免文件显示被压缩
• 手动关联CSS和Source Map：
  打开对应的CSS文件，在末尾加一行注释：/*# sourceMappingURL=style.css.map */（把文件名换成你自己的），这样IDE会明确知道这个CSS对应的Source Map文件在哪里
• 最后再刷新下项目，右键根目录选Reload from Disk，应该就能看到.map文件和CSS文件同层级显示，并且被IDE识别了

三、Spring Boot静态资源配置检查（避免路径错误） #

因为是Spring Boot项目，还要确认静态资源的配置没问题，防止后续访问路径出错：

• 在application.properties或者application.yml里，确认静态资源的映射配置：

  spring.web.resources.static-locations=classpath:/static/,classpath:/public/,classpath:/resources/,classpath:/META-INF/resources/
  spring.web.resources.add-mappings=true
  

• 确保你的css目录是放在src/main/resources/static/下面的，这是Spring Boot默认的静态资源目录，这样前端访问CSS文件的路径才会正确

内容的提问来源于stack exchange，提问作者tony