Laravel+vue 组合项目,vue 使用懒加载出现组件异步的问题怎么解决?

关注laravel社区很久了,学到了很多东西,第一次在这里提问题,提的问题不够详细还请建议。
最近在写一个项目,laravel+vue前后端分离,随着项目的扩大,app.js越来越大,生产环境达到了5M,于是使用了懒加载,使用了懒加载后app.js在1M左右,使用了负载均衡有5M的带宽,打开首页速度几百毫秒,速度还算可以接受,以下是使用懒加载的路由配置:

{
                path:'',
                name:'home',
                component: r => require(['./views/home/Home.vue'],r)
            },
            {
                path:'message',
                name:'message',
                component: r => require(['./views/home/Message.vue'],r)
            },
            {
                path:'master',
                name:'master',
                component: r => require(['./views/home/Master.vue'],r)
            },
            {
                path:'mood',
                name:'mood',
                component: r => require(['./views/home/Mood.vue'],r)
            },
            {
                path:'life',
                name:'life',
                component: r => require(['./views/home/Life.vue'],r)
            },

这是部分代码,其实使用懒加载也就component: r => require(['./views/home/Life.vue'],r)的区别,但这就出现了异步组件加载的问题:

front.ac1e389bec74d2141162.js:145 TypeError: Cannot read property 'call' of undefined
    at __webpack_require__ (front.ac1e389bec74d2141162.js:50)
    at Object.<anonymous> (front.ac1e389bec74d2141162.js:107777)
    at <anonymous>

file
这个问题在线下不管是npm run dev 还是npm run prod都不能重现,上线后在windows打开偶尔会出现这个问题,但是强制刷新就能正常打开了,在mac打开会经常出现这个问题,强制刷新没有用,这个是点击链接后报的错,然后页面打开的是空白。
本人前端并不是非常专业,百度和google了,说是wepack2的问题,但我的项目使用的是wepack3,想不到解决的办法,所以来请各位大神帮忙,问题描述不清楚可以提出来,笔芯-_-

雪花飘

《L04 微信小程序从零到发布》
从小程序个人账户申请开始,带你一步步进行开发一个微信小程序,直到提交微信控制台上线发布。
《L05 电商实战》
从零开发一个电商项目,功能包括电商后台、商品 & SKU 管理、购物车、订单管理、支付宝支付、微信支付、订单退款流程、优惠券等
最佳答案

已经解决了,在wepack.mix.js文件的扩展配置给chunkFilename加上hash值:js/chunk/[name].js?v=[chunkHash],之前windows强制刷新可以,mac强制刷新不可以,原因是我一直以为mac的强制刷新是command+R,后来才发现是shift+command+R

1年前 评论
讨论数量: 6

先自己来一个,之前使用markdown一直以为markdown不能上传图片,这次怕问题描述不清楚,试着粘贴了一下,竟然可以上传图片,哈哈

1年前 评论

已经解决了,在wepack.mix.js文件的扩展配置给chunkFilename加上hash值:js/chunk/[name].js?v=[chunkHash],之前windows强制刷新可以,mac强制刷新不可以,原因是我一直以为mac的强制刷新是command+R,后来才发现是shift+command+R

1年前 评论

我也出现这问题了,没明白怎么改的,麻烦图片贴出来,谢谢!

11个月前 评论

@自由飞

mix.webpackConfig({ output:{ publicPath:'/',//不加这个会报语法错误 chunkFilename:js/chunk/[name].js//分割文件存放位置 } }) 
11个月前 评论

@Winner

file

我webpack不懂,我这个应该咋加

11个月前 评论

@Winner

file

谢谢大神不出错了 :grin:

11个月前 评论

请勿发布不友善或者负能量的内容。与人为善,比聪明更重要!

社区文档:

将托管在 packagist.org 和 github.com 的扩展包使用国内 CDN 加速
GitHub Laravel 扩展包 TOP 250
速查表方便快速查询框架功能,支持手机访问,支持中英文版本
Laravel 中文文档,由社区用户翻译和维护,将会保持一直更新
此文档的目的,就是为了提高技术团队的凝聚力、一致性和生产效率。
开发环境的部署,开发者工具的选择,适用于 Mac 和 Windows。
浓缩过后的精华
Laravel Nova 后台管理面板文档的中文翻译
Lumen 中文文档,由社区用户翻译和维护,将会保持一直更新
Laravel 下知名扩展包 Dingo API 的中文文档,Laravel API 开发必知必会