之前在vue的路由配置文件中看到了/* webpackChunkName:"lodash" */这个注释，

在学习了webpack之后了解其做用，作用就是webpack在打包的时候，对异步引入的库代码（lodash）进行代码分割时（需要配置webpack的SplitChunkPlugin插件），为分割后的代码块取得名字

import异步加载的写法实现页面模块lazy loading懒加载（Vue中的路由异步加载）：

Vue中运用import的懒加载语句以及webpack的魔法注释，在项目进行webpack打包的时候，对不同模块进行代码分割，在首屏加载时，用到哪个模块再加载哪个模块，实现懒加载进行页面的优化。

如下例子：在点击页面时再加载lodash

Webpack之魔法注释/* webpackChunkName:"lodash" */的做用的更多相关文章

  1. 为Dynamics CRM注释的图片附件做个预览功能

    关注本人微信和易信公众号: 微软动态CRM专家罗勇 ,回复163或者20151017可方便获取本文,同时可以在第一时间得到我发布的最新的博文信息,follow me! Dynamics CRM中注释可 ...

  2. Webpack实现按需打包Lodash的几种方法详解

    参考链接:https://www.jb51.net/article/113235.htm 在vue-cli3中需要将babel-preset-es2015插件更换为@babel/preset-env插 ...

  3. 深入浅出 webpack 之基础配置篇

    前言 前端工程化经历过很多优秀的工具,例如 Grunt.Gulp.webpack.rollup 等等,每种工具都有自己适用的场景,而现今应用最为广泛的当属 webpack 打包了,因此学习好 webp ...

  4. 使用 webpack 优化资源

    在前端应用的优化中,对加载资源的大小控制极其的重要,大多数时候我们能做的是在打包编译的过程对资源进行大小控制.拆分与复用.本片文章中主要是基于 webpack 打包,以 React.vue 等生态开发 ...

  5. 10个Vue开发技巧助力成为更好的工程师·二

    优雅更新props 更新 prop 在业务中是很常见的需求,但在子组件中不允许直接修改 prop,因为这种做法不符合单向数据流的原则,在开发模式下还会报出警告.因此大多数人会通过 $emit 触发自定 ...

  6. 提升webpack打包速度

    webpack打包文件体积过大,怎么提升速度? 借助webpack visualizer可视化插件,来看构建的情况.这个问题要具体情况具体分析,看看打包文件有哪些块头比较大,哪些不常改变,最好列一个l ...

  7. webpack摸索笔记

    上一个链接,入门webpack看这篇文章最好:https://segmentfault.com/a/1190000006178770 1.先安装好node 2.建个项目文件 3,.window+r,打 ...

  8. webpack配置之代码优化

    前面的话 前面介绍了webpack的基本配置,本文将详细介绍webpack中关于代码优化的配置 打包公共代码 CommonsChunkPlugin 插件,是一个可选的用于建立一个独立文件(又称作 ch ...

  9. webpack的版本进化史

    一.概述2015,webpack1支持CMD和AMD,同时拥有丰富的plugin和loader,webpack逐渐得到广泛应用. 2016.12,webpack2相对于webpack1最大的改进就是支 ...

随机推荐

  1. render()到底渲染的什么?

    1.格式 render(request,"xx.html",{"xx": xx}) 2.本质 通过模板语言动态渲染字符串(HTML文件) 注意: 1.HTML文 ...

  2. 06hive企业调优

    一.Fetch抓取 Fetch抓取是指,Hive 中对某些情况的查询可以不必使用MapReduce计算. 在 hive-default.xml.template 文件中 hive.fetch.task ...

  3. 学_汇编语言_王爽版 要点采集笔记（未完待续…）

    第一章 基础知识 存储器(内存)存放CPU工作的指令和数据(CPU可以直接使用的信息在内存中存放):指令和数据都是二进制数没有任何区别,由CPU决定是数据还是指令 内存单元:存储器被分为若干个存储单元 ...

  4. 将Ubuntu下网卡名称enss改为eth0

    将Ubuntu下网卡名称enss改为eth0   sudo nano /etc/default/grub 找到GRUB_CMDLINE_LINUX=""改为GRUB_CMDLINE ...

  5. 爬虫之协程，selenium

    1.什么是代理?代理和爬虫之间的关联是什么? 2.在requests的get和post方法常用的参数有哪些?分别有什么作用?(四个参数) - url headers parmas/data proxi ...

  6. Docker(二) 镜像

    简介 Docker镜像是什么? 它是一个只读的文件,就类似于我们安装操作系统时候所需要的那个iso光盘镜像,通过运行这个镜像来完成各种应用的部署. 这里的镜像就是一个能被docker运行起来的一个程序 ...

  7. nmap详解之选项说明

    功能选项 功能选项可以组合使用.一些功能选项只能够在某种扫描模式下使用.nmap会自动识别无效或者不支持的功能选项组合,并向用户发出警告信息. 如果你是有经验的用户,可以略过结尾的示例一节.可以使用n ...

  8. Docker三剑客之compose

    简介 Compose 项目是 Docker 官方的开源项目,负责实现对 Docker 容器集群的快速编排.从功能上看,跟 OpenStack 中的 Heat 十分类似.其代码目前在 https://g ...

  9. Oracle:imp导入dmp文件

    oracle命令行登录 sqlplus / as sysdba 创建用户 create user 用户 identified by 密码 ; 创建表空间 create tablespace 表空间名 ...

  10. 基于Arduino开发的简易“高水位报警系统解决方案”

    长期以来,针对“某些办公室空调没有排水系统,只能用水桶接水,经常造成水漫金山的问题”而提出来的. 材料:Arduino开发板一块.水位传感器一个.高电平蜂鸣器一个.杜邦线若干. 原理:将水位传感器置于 ...