Lazy loading method of VUE routing component

Lazy loading method of VUE routing component

1. In the case of using VUE-CLI scaffolding for the project;
2. In the webpack.base.conf.js file under the build file
3. Add a sentence of chunkFilename:'chunk[id].js?[chunkhash]' in output: ,

  output: {
    
    
    path: config.build.assetsRoot,
    filename: '[name].js',
     chunkFilename: 'chunk[id].js?[chunkhash]', //路由组件懒加载核心之一，必须添加
    publicPath: process.env.NODE_ENV === 'production'
      ? config.build.assetsPublicPath
      : config.dev.assetsPublicPath
  },

4. Modify index.js in the router folder

{
    
    
      path: '/',
      name: 'navbar',
      component:resolve=>require(['../components/public/navbar.vue'],resolve)//路由组件懒加载方法之一。resolve方法
    },