正常导入路由组件是如下图所示
Vue --- 路由懒加载的使用

如果要使用懒加载来加载路由组件,改成const Home = () => import("../components/Home")即可,最终结果如下图
Vue --- 路由懒加载的使用

上述操作完成后,在控制台执行npm run build进行项目打包,如下图
Vue --- 路由懒加载的使用
执行完后,会发现项目文件夹下会多出一个dist的文件夹(如果没有,请收起最外层的项目文件夹,再次展开即可),该文件夹下有个js文件夹,并且会有数字序列的js文件,该数字序列的js文件就是对应的路由,如下图
Vue --- 路由懒加载的使用
比如我打开这三个js文件,就能看到我们熟悉的内容
Vue --- 路由懒加载的使用
Vue --- 路由懒加载的使用

相关文章: