前言cypress官网解放劳动密集型工作，拥抱智力密集型工作，用代码测试代码，测试驱动开发，做一名会偷懒的工程师。使用cypress测试框架，配置简单，上手容易，界面友好，支持录屏，时间碎片，一键执行。安装安装这一块是最麻烦的，有可能安装过程中会被墙。npm install cypress --save-devyarn add cypress --dev如果以上过程很慢，可以在官网下载安装包：cy

概念Karma（卡玛）是一个测试运行器，它可以呼起浏览器，加载测试脚本，然后运行测试用例，完成后关闭浏览器。Mocha（摩卡）是一个单元测试测试框架/库，它可以用来写测试用例。Chai 是用于节点和浏览器的BDD / TDD断言库，可以与任何javascript测试框架完美地配对。我们主要就是用Karma与Mocha来实现自动化测试。下面我以自己Vue的项目举例。一、安装K...

当我们在进行大并发的直播消息互动时，对浏览器的负荷是比较大的，如何提供一种方法来评估实时网页性能以及相关的数据呢？可以用谷歌浏览器开发者工具中的Performance绘制火焰图对网页进行分析。接下来我们通过一步步使用Performance，来看看Performance有哪些强大的功能！1、工具位置打开f12开发者工具，选中Performance。我们可以看到如上界面。表示...

一，背景介绍通常前端程序员在按照UI效果图编辑网页时，不可能一口将全部的代码全部写好，通常情况是编写边调，经过反反复复的调试后才能达到要求的效果，这时候用Chrome浏览器的F12开发者工具能形象直观的帮助程序员调试自己的代码，用好F12能显着提高开发者的工作效率，加快调试的速度。二，知识剖析1，F12开发人员工具是一套按需采用的工具，网站开发人员可以随时在任何网页上使用F...

前言next是一款用JS开发的全栈框架，它是基于express框架基础上开发而成，可以用react写客户端，node.js写服务端。一份代码可在前后端同时运行，这在next中称之为同构！一些next.js框架基础介绍创建项目：npm init next-app 项目名，项目创建好后next会帮你搭好基础通用的模板，大多常用的api以及写法都能在模板中找到。自定义head：使用<Head&gt

前言Echarts原先是由百度开源的一款数据可视化库，现在由Apache Software Foundation (ASF) 孵化管理。它是一款文档非常健全的数据可视化库，你只需要按照文档一步步做，就能做出你想要的可视化效果。那么我们现在开始吧。安装Echarts在项目中安装：yarn add echartsyarn add --dev @types/echarts在项目中引用：import ec

默认情况下electron会有一个默认的原生导航栏。但在具体的业务场景下，这个原生的导航栏显得就那么适用了。需要更进一步根据产品自定义导航栏。一、去除原生导航栏在主进程代码中配置frame: false 关闭原生导航栏import {BrowserWindow} from 'electron'mainWindow = new BrowserWindow({...

前言Express一共提供了五个大类的API，每个大类其核心只有几个需要记忆，其它API触类旁通即可（官方文档）。五大类APIexpress.xxxapp.xxxrequest.xxxresponse.xxxrouter.xxx一些概念：子应用：let app = express() // 主应用let admin = express() // 另一个应用app.use('/admin', adm

前言next是一款用JS开发的全栈框架，它是基于express框架基础上开发而成，可以用react写客户端，node.js写服务端。一份代码可在前后端同时运行，这在next中称之为同构！一些next.js框架基础介绍创建项目：npm init next-app 项目名，项目创建好后next会帮你搭好基础通用的模板，大多常用的api以及写法都能在模板中找到。自定义head：使用<Head&gt

需求分析支持传入当前页码参数并展示；支持页数过多的部分用省略号显示，并会动态变化；支持支持点击左右方向键切换页码；支持在只有一页的时候隐藏pager；方法实现1、pager外部组件传参定义：一共可传4个参数：total，页码条数current，当前页码current.sync，点击页码的current参数回调hide-one-page, 默认不填一页时显示，false则隐藏<T-pager