实现路由懒加载的方式有哪些?

devtools/2024/12/24 3:11:03/

1函数式懒加载

使用vue的异步组件和webpack的代码分割功能,通过()=>import()这种函数形式来定义路由组件,示例如下:

const Home = () => import('@/views/Home.vue');
const router = new VueRouter({routes: [{ path: '/', component: Home }]
});

2箭头函数结合require

这种方式是利用webpack的代码分割特性,使用箭头函数和require语句来实现懒加载,任意:

const Home = resolve => require(['@/views/Home.vue'], resolve);
const router = new VueRouter({routes: [{ path: '/', component: Home }]
});

3命名chunk

通过给import()函数传递一个webpackChunkName注释,可以为懒加载的代码快指定一个名称方便webpack打包后的文件中进行识别和管理,示例如下:

const Home = () => import(/* webpackChunkName: "home" */ '@/views/Home.vue');
const router = new VueRouter({routes: [{ path: '/', component: Home }]
});


http://www.ppmy.cn/devtools/144879.html

相关文章

RFdiffusion get_torsions函数解读

函数功能 get_torsions 函数根据输入的原子坐标(xyz_in)和氨基酸序列(seq),计算一组主链和侧链的扭转角(torsions)。同时生成备用扭转角(torsions_alt),用于表示可以镜像翻转的几何结构,并返回掩码(tors_mask)和是否平面化(tors_planar)的信息。 输入参数 xyz…

安卓开发实现图像处理相关功能

彩色图像转换黑白图像实验 基本图形绘制与填充实验 Mat像素操作实验 图像滤波实验 图像轮廓特征检测实验 图像局部特征检测实验 人脸美颜

websocket 局域网 webrtc 一对一 多对多 视频通话 的示例

基本介绍 WebRTC(Web Real-Time Communications)是一项实时通讯技术,它允许网络应用或者站点,在不借助中间媒介的情况下,建立浏览器之间点对点(Peer-to-Peer)的连接,实现视频流和&am…

Redis——缓存预热+缓存雪崩+缓存击穿+缓存穿透

文章目录 1、 缓存预热2、 缓存雪崩3、 缓存击穿4、 缓存穿透总结 1、 缓存预热 什么是预热: mysql加入新增100条记录,一般默认以mysql为准作为底单数据,如何同步给redis(布隆过滤器)这100条新数据。 为什么需要预热…

Kafka-创建topic源码

一、命令创建topic kafka-topics --create --topic quickstart-events --bootstrap-server cdh1:9092 --partitions 2 --replication-factor 2 二、kafka-topics脚本 exec $(dirname $0)/kafka-run-class.sh org.apache.kafka.tools.TopicCommand "$" 脚本中指定了…

基于微信小程序的短视频系统(SpringBoot)+文档

💗博主介绍💗:✌在职Java研发工程师、专注于程序设计、源码分享、技术交流、专注于Java技术领域和毕业设计✌ 温馨提示:文末有 CSDN 平台官方提供的老师 Wechat / QQ 名片 :) Java精品实战案例《700套》 2025最新毕业设计选题推荐…

LeetCode hot100-92

https://leetcode.cn/problems/minimum-path-sum/description/?envTypestudy-plan-v2&envIdtop-100-liked 64. 最小路径和 已解答 中等 相关标签 相关企业 给定一个包含非负整数的 m x n 网格 grid ,请找出一条从左上角到右下角的路径,使得路径上的…

方正畅享全媒体新闻采编系统 screen.do SQL注入漏洞复现(附脚本)

0x01 产品描述: 方正畅享全媒体新闻生产系统是以内容资产为核心的智能化融合媒体业务平台,融合了报、网、端、微、自媒体分发平台等全渠道内容。该平台由协调指挥调度、数据资源聚合、融合生产、全渠道发布、智能传播分析、融合考核等多个平台组成,贯穿新闻生产策、采、编、…