zoukankan      html  css  js  c++  java
  • Vue打包后放到服务器出现Loading chunk {n} failed 错误

    导航栏点击切换时 会出现Loading chunk {n} failed  ,刷新之后便不会出现。而且n在最新的build的文件中,n没有存在

    偶然一次发现,项目更新迭代开发时上传测试环境后就会出现,当我们打包后某些js文件会改变,再上传到服务器后,由于浏览器缓存问题,用户在访问的时候还会再访问之前的js文件。就会出现Loading chunk {n} failed这种报错,

    思考到了路由懒加载的情况下,访问当前应用进行路由跳转时都是实时动态的从服务器上拉取相应模块的js文件,这时候我们改完代码打包上线,js文件名更换了,路由跳转的时候由于页面并未刷新,所以还是访问的原来的文件名,这是就会出现找不到模块的错误。


    解决办法:

    我们需要给路由加一个错误的回调方法,在监听到路由报错之后进行页面刷新操作,这时就可以获取到当前最新的代码来解决报错问题。

    /* 路由异常错误处理,尝试解析一个异步组件时发生错误,重新渲染目标页面 */
    router.onError((error) => {
    const pattern = /Loading chunk (d)+ failed/g;
    const isChunkLoadFailed = error.message.match(pattern);
    const targetPath = router.history.pending.fullPath;
    if (isChunkLoadFailed) {
    router.replace(targetPath);
    }
    });

  • 相关阅读:
    MR中简单实现自定义的输入输出格式
    简单实现CombineFileInputFormat
    提高mapreduce性能的七点建议
    MR中使用sequnceFIle输入文件
    Hive中使用LZO
    JVM启动参数详解 (转)
    ubuntu12.04中shell脚本无法使用source的原因及解决方法
    hadoop 错误
    poj 3211 Washing Clothes
    hdu 3535 AreYouBusy
  • 原文地址:https://www.cnblogs.com/FACESCORE/p/11308740.html
Copyright © 2011-2022 走看看