原来一直以为vue@cli3 就是创建模板的工具,读了官方文档才知道原来这么有用,不少配置让我长见识了

Prefetch 懒加载配置

懒加载相信大家都是知道的,使用Import() 语法就可以在需要的时候加载了,但是读了官方文档Prefetch一节后,发现事情并没有想象的那么简单。

文档写的很清楚,Prefetch是在空闲的时候就加载一些不着急的文件,并且import默认是加上了Prefetch的,也就是说你使用了import可能并不是你想要的结果(比如用户点击某个按钮才触发加载,不然永远不加载,这样可以节省流量),

为了验证写了个小用例测试了下,最后看network发现真的是就算你懒加载了,但是等程序空闲了并且父级区块加载了,他还是会提前加载你可能需要的文件。

怎么关闭呢,文档也说的很清楚

打包现代模式

之前看性能优化的文章有提到过,因为babel转义会使代码执行变慢,但是为了兼容又需要转义,解决办法是生成2套代码,现代浏览器使用不转义的代码,老浏览器使用转义的代码,使用type="module"来区分是哪种浏览器,现在vue-cli3已经给你做好配置了,你只需要加一个参数就能使用了,真爽~

文档地址: https://cli.vuejs.org/zh/guide/browser-compatibility.html#现代模式

读vue-cli3 官方文档的一些学习记录的更多相关文章

  1. vue插件官方文档,做个记录

    vue的插件,组件都可以按照这种方式添加 官方文档 https://cn.vuejs.org/v2/guide/plugins.html 做个记录用

  2. 第0001题 : 产生随机数(顺便读random模块官方文档)

    看这个之前我准备先看一下random模块的官方文档... 在整个随机模块中,  最基础的就是random, 它产生一个 [0.0, 1.0)的浮点数. 这个模块下所有的函数实际上是绑定在一个叫做ran ...

  3. Swift -- 官方文档Swift-Guides的学习笔记

    在经历的一段时间的郁闷之后,我发现感情都是虚伪的,只有代码是真实的(呸) 因为看了swift语法之后依然不会用swift,然后我非常作死的跑去看官方文档,就是xcode里自带的help>docu ...

  4. 参考Dubbo3官方文档做的学习笔记

    文章目录 概念与架构 2.1 服务发现 Dubbo3官方文档: https://dubbo.apache.org 服务:是 Dubbo 中的核心概念,一个服务代表一组 RPC 方法的集合,服务是面向用 ...

  5. 终端开发补充 : 读 curses模块官方文档...

    curses是一个提供终端屏幕打印和键盘处理的库, 我个人的理解就是终端里的gui(当然它是基于文本的)... 写2048的时候用到了这个库, 所以现在过来好好研究一下这个库... 下面是文档内容 : ...

  6. Vue.js官方文档学习笔记(三)创建Vue实例

    创建Vue实例 每个 Vue 应用都是通过用 Vue 函数创建一个新的 Vue 实例开始的: var vm=new Vue({ //选项 }) Vue的设计受到了mvvm的启发 当创建一个 Vue 实 ...

  7. Vue.js官方文档学习笔记(二)组件化应用的构建

    组件化应用的构建 组件化应用允许我们使用小型.独立和通常可复用的组件构建大型应用. Vue注册组件 Vue.component('todo-item',{template:'<li>这是个 ...

  8. Vue.js官方文档学习笔记(一)起步篇

    Vue.js起步 Vue.js介绍 Vue (读音 /vjuː/,类似于 view) 是一套用于构建用户界面的渐进式框架.与其它大型框架不同的是,Vue 被设计为可以自底向上逐层应用.Vue 的核心库 ...

  9. vue.js官方文档 PDF

    链接:https://pan.baidu.com/s/1jHMBb5W 密码:gsks

随机推荐

  1. Requests方法 -- 参数关联

    一.删除草稿箱1.参数这篇https://www.cnblogs.com/Teachertao/p/11144726.html 2.删除刚才保存的草稿 3.用 fiddler 抓包,抓到删除帖子的请求 ...

  2. noip模拟26[肾炎黄·酱累黄·换莫黄]

    \(noip模拟26\;solutions\) 这个题我做的确实是得心应手,为啥呢,因为前两次考试太难了 T1非常的简单,只不过我忘记了一个定理, T2就是一个小小的线段树,虽然吧我曾经说过我再也不写 ...

  3. POJ4007 Flood-it! 题解

    调得我快死了啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊!!!! 先自己写了几发,老是 T,然后去看题解,大体思路居然都差不多,估计是自己写挂了orz. 几乎所有题解都有个vis数组,真 nm 看不懂到底是什么意思 ...

  4. 第七篇 -- 常用界面组件的使用(QSlider和QProgressBar)

    首先画个图 ui_proBar.py # -*- coding: utf-8 -*- # Form implementation generated from reading ui file 'ui_ ...

  5. 用activiti实现类似钉钉审批流程-附整个系统源码

    前言 目前市场上有很多开源平台没有整合工作流,即使有,也是价格不菲的商业版,来看这篇文章的估计也了解了行情,肯定不便宜.我这个快速开发平台在系统基础功能(用户管理,部门管理-)上整合了工作流,你可以直 ...

  6. php header 设置文件下载

    控制器 php 代码: $filepath = "http://www.jiesen365.com/uploadfile/20150519044903-897.pdf"; //下载 ...

  7. memcache(11211)未授权访问

    1.安装Memcache服务端 sudo apt-get install memcached 2.启动服务 sudo memcached -d -m 128 -p 11211 -u root 3.ap ...

  8. @FeignClient常用属性

    @FeignClient(name = "gateway-test", value = "gateway-test", url = "localhos ...

  9. ES6新特征

    1.块级作用域 {   }  就是块级作用域,还包括if.else.for.while...下都属于块级作用域. let 声明的变量不存在变量的提升,不允许let反复声明同一个变量:块级作用域下let ...

  10. 关于C语言中对数字的扩展和缩短

    关于对数字的扩展:如果需要在不改变他的类型的情况下去扩展一个数字 有符号数字: 如果最高位为0---向左按位复制0 如果最高位为1---向左按位复制1 无符号数字:向左按位复制0即可 对于数字的缩短: ...