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,想不到解决的办法,所以来请各位大神帮忙,问题描述不清楚可以提出来,笔芯-_-

雪花飘

《L01 基础入门》
我们将带你从零开发一个项目并部署到线上,本课程教授 Web 开发中专业、实用的技能,如 Git 工作流、Laravel Mix 前端工作流等。
《L02 从零构建论坛系统》
以构建论坛项目 LaraBBS 为线索,展开对 Laravel 框架的全面学习。应用程序架构思路贴近 Laravel 框架的设计哲学。
最佳答案

已经解决了,在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年前

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

8个月前

@自由飞

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

@Winner

file

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

8个月前

@Winner

file

谢谢大神不出错了 :grin:

8个月前

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

社区文档:

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