项目场景：

我正在做一个Spring Boot和Vue前后端分离的小项目，前端使用Vue+Vue Router+Vuex+axios，后端使用Spring Boot+Spring Security+Mybatis plus。 当我把Vue打包完成的html css js放入static文件夹中，并打包成jar运行的时候，却不能访问某些界面。

报错信息

GET http://localhost:8080/css/chunk-721da9e7.1f8fd1e3.css net::ERR_ABORTED 404
GET http://localhost:8080/css/chunk-f9893a7a.1d54c165.css net::ERR_ABORTED 404

过程描述：

浏览器打开控制台，发现某些css文件加载发生404错误

404图片
console报错

打开404的网址后是未登录，被security拦截到了

-41图片

以为是没有配置静态资源放行，但一想又不对，其他的css可以访问到

正常css

然后我就去看Vue打包之后的文件夹，确认是否有那个加载不到的css，打开之后发现，有两个为0KB的css文件

0kb的css

再将加载不到的css文件，正好是两个0KB的css文件

404的css

Vue的组件中确实有写了class但没有内容的style标签

在这里插入图片描述

将所有的Vue组件中只带有class而没有内容的标签删除，可以只删除.home{}，不删除style标签，重新打包

重新打包css

打包完成之后，打开dist文件夹查看css文件，确保没有0KB的文件，重新放入Spring Boot的static中，运行

解决完成的请求

成功访问！

总结：

这应该是使用Spring Security并且css文件为0KB的时候才会出现的问题，奈何本人菜鸟，没有继续深挖原因，有知道的大佬可以在评论区说一下

# vue.js # spring boot # css # javascript
Logo
Vue

前往低代码交流专区

更多推荐

vue 表单验证

1、6位小写字母和数字必须包含两个字母rules: [{ required: true, message: "XXX不能为空", trigger: "blur" },{ max: 6, message: "最大长度为6位字符", trigger: "blur" },{pattern: /^(?=(?:[^a-z]*[a-z]){2})[a-z0-9]{6,6}$/, //不连续的两位字母// /^

avatar Vue
cover

echarts堆叠柱状图

avatar Vue

Vue里echarts根据页面大小动态调整/自适应

Vue里echarts根据页面大小动态调整/自适应

avatar Vue