VUE的路由懒加载和组件懒加载

版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。

本文链接： https://blog.csdn.net/HarryHY/article/details/102466692

组件懒加载

script

const sundrying =()=>import("../../components/chatComponents/Sundrying.vue")
const Leaderboard =()=>import("../../components/chatComponents/Leaderboard.vue")
const Quiz =()=>import("../../components/chatComponents/Quiz")

const sundrying = resolve => require(['../../components/chatComponents/Sundrying'], resolve)
const Leaderboard = resolve => require(['../../components/chatComponents/Leaderboard'], resolve)
const Quiz = resolve => require(['../../components/chatComponents/Quiz'], resolve)

const sundrying = r => require.ensure([], () => r(require('../../components/chatComponents/Sundrying.vue')), 'group-index')
const Leaderboard = r => require.ensure([], () => r(require('../../components/chatComponents/Leaderboard')), 'group-view')
const Quiz = r => require.ensure([], () => r(require('../../components/chatComponents/Quiz')), 'group-view')

components

  components: {
    sundrying,
    Leaderboard,
    Quiz
  },

路由懒加载

router.js

{
      path: '*',
      name: 'error',
      component: () =>
        import('./views/404/404.vue')
    }

router.js

在这里插入代码片