Vue-router loads components asynchronously

当我们开发vue+webpack项目时,可能会发现打包出的项目js过大,严重影响了首屏页面的访问速度,这就需要利用vue路由的异步加载组件功能。

Load components asynchronously

在页面路由配置js文件中,避免在开头直接引入相关组件,当配置特定路由对应组件时再使用import引入对应组件。
{
path: '/app',
component: () => import('../pages/application.vue')
}

**报错unexpected token的解决办法:**项目安装babel-plugin-syntax-dynamic-import,然后在.babelrc中配置“plugins”:[“syntax-dynamic-import”],重启服务即可。

Guess you like

Origin blog.csdn.net/sjs1995/article/details/107386495