vue中项目页面空白但不报错产生的原因及分析

vue项目页面空白但不报错产生的原因分析

vue项目中我们请求一个路由，打开页面发现页面是空白的，产生的主要原因有四种：

1.路由重复

如果配置了两个路由是重复的，比如配置了两个【path: ‘/’】，那么访问就会看到空白页面，这时候改下重复的路由配置即可

2.app.js中删除了router-view

我们可以把 app.js看成路由的顶级路由，再创建路由他属于二级路由，依次类推

3.路由导航守卫没有next（）

我们写路由导航守卫时，next相当于是安保人员，只有他有权力进行放行，如果他不进行放行，我们肯定无法接着访问，从而导致页面空白

4.访问的就是空白页面

这种情况比较少，我们再访问一个新的页面时，一般会写点文字进行页面展示

打包vue文件后页面空白，出现报错

报错如下：

Refused to apply style from 'http://127.0.0.1:5500/css/chunk-43aa77e1.33bcbef1.css' because its MIME type ('text/html') is not a supported stylesheet MIME type, and strict MIME checking is enabled.Failed to load resource: the server responded with a status of 404 (Not Found)

此块代码意思为：

拒绝应用’http://127.0.0.1：5500/css/chunk-43aa77e1.33bcbef1.css’，因为它的MIME类型（‘text/html’）不是受支持的样式表MIME类型，并且需要严格的MIME检查已启用。

失败加载资源：服务器的响应状态为404（未找到）

Failed to load resource: the server responded with a status of 404 (Not Found)

此块代码意思为：

未能加载资源：服务器响应状态为404（未找到）

引起此类报错的原因是因为js、css等文件过多，需手动添加（./）获取当前文件路径，但js等文件过多手动添加路径会引起冲突，

此类报错的解决方案为：在根目录中添加一个名为vue.config.js的文件，操作如下

总结

以上为个人经验，希望能给大家一个参考，也希望大家多多支持脚本之家。

最新评论