自定义博客皮肤VIP专享

*博客头图:

格式为PNG、JPG,宽度*高度大于1920*100像素,不超过2MB,主视觉建议放在右侧,请参照线上博客头图

请上传大于1920*100像素的图片!

博客底图:

图片格式为PNG、JPG,不超过1MB,可上下左右平铺至整个背景

栏目图:

图片格式为PNG、JPG,图片宽度*高度为300*38像素,不超过0.5MB

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+

原创 记一次webpack构建提速

写在开头 由于业务调整需要,最近接盘了公司内部云平台的项目H。看了代码,开发了几个需求,我的第一感觉是,H项目真的好严肃,还有厚重的历史感。经过多年的开发与维护,H项目经过了数十位前端同学之手,“前任”小伙伴们在里面花费了大量的时间与精力。这里面涉及到的技术栈也错综复杂,包含了react、webp...

2020-01-03 15:48:33 88 0

原创 昨晚,部署线上环境的我炸了

改了一天的bug,终于是觅得一时空闲。思来想去,我还是想把自己刚刚平复不久的“爆炸”心态记录下来。事情还要从昨天下午四点半左右说起,只因为后端的同事C在工作群里@了我一下,对我说了三个字:“上线吧…” 说实话,想想还是有点小激动的。自从我独立负责这个项目以来,每天都在公司的考勤表下留下了加班打车...

2019-06-27 18:09:47 217 2

原创 Chrome Extension插件开发概述

目录一、前言一、Chrome Extension还是Chrome Plugin?二、为什么选择Chrome浏览器?三、关于Chrome Extension四、开发调试1. 调试弹出页(popup)2. 调试选项页(option)3. 调试后台页(background)4. 调试内容脚本(conte...

2019-02-02 16:11:42 6335 4

原创 js轮询之setInterval踩坑小记

写在开头 最近负责的项目要接入计费功能,有了计费自然需要充值。说起充值,无外乎支付宝、微信和网银了,然后前端调用充值接口后,需要起一个轮询任务,去监听支付状态,根据轮询结果来进行下一步的操作(当然了,有条件的大户人家想要直接上websocket也没问题)。所以,业务场景倒是很easy,梳理完逻辑我...

2020-05-25 16:13:31 33 0

原创 How JavaScript Works 第4章 中文翻译

Chapter 4 How Big Floating Point Works 第 4 章 大浮点数是如何工作的 Don’t be a hero, young man. There’s no percentage in it. ———— Harlan Potter 年轻人,别逞英雄了。 没有什么好...

2020-05-07 10:06:34 93 0

原创 git 最常用的几个操作命令

今天下楼陪女朋友散步,边走边读了一篇公众号推送的文章,图文讲解了10个常用的git操作命令,读完以后感觉对这几个命令的理解加深了不少,又愉快的复习了一下git的常识,写个小记再加深一下印象。 1. 合并(merge) git merge dev // 合并dev分支上的修改 其实,merge分为...

2020-05-05 21:52:56 46 0

原创 等宽字体和比例字体

写在开头 前段时间,某内部平台发了一条2020年以来的首篇公告,然后便出现了下图的案发现场(其实我一直都没发现@_@,还是可爱的大佬提醒了一下),事出反常必有妖! 吭吭哧哧一顿操作,加宽了包裹日期的盒子的宽度修复了问题。发现 2020-02-24 和 2019-04-16 这两个日期的长度竟然不...

2020-04-19 17:51:56 196 0

原创 Unicode 和 UTF-8、GBK、GB2312的那些事儿

Unicode 和 UTF-8 Unicode 是一种字符集合,现在可容纳 100 多万个字符。是统一编码,它建立了一个全世界统一的码表。每个字符(世界上的所有文字)对应一个不同的 Unicode 编码(在这张码表中都是唯一的),但是它只规定了符号的二进制代码,却没有规定这个二进制代码在计算机中如...

2020-03-16 22:53:57 43 0

原创 发布npm包到github packages

GitHub 推出 GitHub Package Registry 后,提供了软件包管理服务,开发者通过它可发布公共或私有软件包。对于开发人员来说非常的方便,目前支持许多大家都比较熟悉的包管理工具,如: npm (JavaScript) Maven (Java) RubyGems (Ruby) ...

2020-03-01 14:12:18 345 0

原创 Git配置多用户,区分你的Workspace和Personal space

在工作与学习之间,我们难免会用到两个甚至更多的git账户,为了避免账户之间的混淆,可以在本地配置不同的账户来区分。通常划分的方式有两种, 按工程配置多用户 按目录配置多用户 这里是git的文档,长的很啊。 1. 按工程配置 git的配置变量可以放在三个地方: /etc/gitconfig 系...

2020-01-03 15:49:19 100 0

原创 iterm2 保存ssh账号自动连接

作为一名coder,我们经常需要连接服务器进行一些操作,然而冗长的ssh密码登录属实有些繁琐。如果你使用了终端工具iTerm2,便可以事半功倍! iTerm2具有很多优点: 智能选中,双击选中,三击选中整行,四击智能选中; 全文查找 command + f ; 窗口垂直command + d、水...

2019-12-18 15:27:57 70 0

原创 webpack中hash、chunkhash和contenthash

https://www.cnblogs.com/giggle/p/9583940.html https://blog.csdn.net/bubbling_coding/article/details/81561362 https://github.com/sorrycc/roadhog/issue...

2019-12-04 12:12:23 75 0

原创 配置Prettier格式化代码

什么是Prettier? 看下官方文档的说明,这里。 Prettier 是一个自定义的代码格式化工具,它支持以下文件格式: JavaScript, including ES2017 JSX Angular Vue Flow TypeScript CSS, Less, and SCSS HTML...

2019-11-18 14:50:50 830 0

原创 如何通过WebRTC开发实时互动AI视频应用

前言 在此之前,简单介绍下前因后果。最近负责一个人脸和手势识别的可视化大屏项目,需要前端负责视频的抽帧和传输任务。起初,我们使用的是海康威视的摄像头,通过局域网来推送RTSP视频流。因为原生的video标签是不支持rtsp格式的视频的,所以前端采用了视频直播常用的JSMpeg + WebSocke...

2019-11-01 16:30:38 362 0

原创 git rebase修改commit记录

主要命令 git rebase -i 命令 开始 假如想要修改最近三次提交信息: git rebase -i HEAD~3 //将想要修改的父提交作为参数,即`HEAD~3^` 同理,修改最近第五次提交信息: git rebase -i HEAD~5 //将想要修改的父提交作为参数,即`...

2019-10-12 15:07:41 250 0

原创 React15版本组件的生命周期

生命周期的三个阶段(初始化阶段、运行中阶段、销毁阶段),三者时间是不固定的,只是在逻辑上的分类,react在不同的生命周期会触发不同的钩子函数。 一、初始化阶段:   getDefaultProps:获取实例的默认属性(即使没有生成实例,组件的第一个实例被初始化CreateClass的时候调用...

2019-10-12 14:56:31 462 0

原创 css hover给当前元素或其他元素添加伪元素

1. 作用于本身伪元素 a:hover::after { content: ""; position: absolute; left: 16px; top: 24px; bottom: 0; right: ...

2019-10-10 11:36:22 561 0

原创 Mac版vscode常用快捷键

收录一下本人常用的vscode快捷键 Option + Up 向上移动行 Option + Shift + Up 向上复制行 Option + Shift + A 添加、移除块注释 Option + Shift + F 格式化文档 Command + Shift + K 删除行 Command +...

2019-09-24 10:48:08 385 0

原创 js中使用Clipboard API获取剪贴板内容

首先,单纯的 JavaScript 没有一个很完美的访问剪贴板(Clipboard)的方案 W3C 标准下的做法(webkit/opera): 使用:Clipboard API and events clipboardData.getData('text/plain') IE...

2019-09-17 16:00:15 3592 0

转载 Common getUserMedia() Errors

在你的getUserMedia()开始运行的那一瞬间,就会遇到各种各样的错误: 用户没有摄像头,只有一个麦克风 用户(不小心地)拒绝了浏览器的使用摄像头请求 用户在你的getUserMedia()代码已经初始化之后才将摄像头/麦克风插到电脑上 媒体设备已经被其他的应用所占用了 ...

2019-09-03 10:49:30 91 0

原创 getUserMedia video视频镜面反转

场景是这样的,我需要调用摄像头不间断地抽帧,发送给后端,后端通过调用人脸库模型进行人脸识别,手势识别。 在此之前,我们尝试了使用摄像头推流的方法,把视频流通过node服务层中转(因为摄像机的ffmepg流不能直接播放),前端拉流以后抽帧。 后来,因为上述方式衍生问题比较多,传输慢、视频延迟、清晰度...

2019-09-02 16:28:12 999 0

原创 Git常见操作教程

文章目录修改commit注释1. 已提交但并未push2. 修改已push的历史注释 修改commit注释 1. 已提交但并未push git为commit命令提供了–amend 参数 git log查看最近的commit记录后,确认修改的是最新的一次commit注释。执行git commit -...

2019-07-29 10:34:01 43 0

原创 Webpack按需异步加载报错:Uncaught (in promise) Error: Loading chunk 39 failed.

本地不会出现此报错,每次打包部署到开发环境后第一次渲染抛出下图错误,然后就处于一直加载的状态,不知道如何解决啊。。。暂且留着你,日后收拾。 ...

2019-07-29 10:17:23 3855 6

原创 npm run build: WARNING in asset size limit: The following asset(s) exceed the recommended size limit

使用webpack4打包生产环境的代码时npm run build:production,遇到了一个小插曲,记录一下: 问题原因: webpack打包后的生成文件和入口文件体积过大,超过了默认值。 解决方法: 1.关闭webpack性能提示 performance: { hints: f...

2019-07-01 18:50:26 1095 0

转载 Jest 断言归纳

Jest 实在是很方便,上手简单,几乎零配置。记录一下学习 Jest matchers。附上大部分说明及示例。 普通匹配器 toBe - toBe 使用 Object.is 来测试是否完全相等 .not - 用来测试相反的用例 .toEqual如果你想检查某个对象的值,请改用 toEqual。 ...

2019-05-31 18:15:29 928 0

转载 不同浏览器的autocomplete特性

自动完成(autocomplete)允许浏览器预测对字段的输入。当用户在字段开始键入时,浏览器会基于之前键入过的值,显示出在输入框中填写的选项。 autocomplete属性适用于form表单,以及表单内的input类型:text, search, url, telephone, email, ...

2019-05-08 11:36:15 264 0

原创 解决mac mysql无法启动

今天mysql突然无法启动服务,即便使用/usr/local/mysql/support-files mysql.server start也无济于事,经过好一番折腾,发现是我装了manager-osx,其中内置的mysql与原来装的mysql冲突了,杀死占用的进程后,重新启动服务即可。 问题出现的...

2019-04-21 16:06:51 4413 0

原创 解决webpack打包错误:this.htmlWebpackPlugin.getHooks is not a function

升级webpack4时踩到了很多坑,其中错误描述如下 this.htmlWebpackPlugin.getHooks is not a function 经过一番搜索,在html-webpack-plugin的issue区看到了如下解决方法,亲测可用。 1.删除node_modules目录...

2019-03-05 15:37:54 2732 0

原创 mac下修改mysql5.7.Xroot初始密码

苹果->系统偏好设置->最下面点MySQL,关闭mysql服务; 进入终端输入cd /usr/local/mysql/bin/,回车; 输入sudo su,回车以获取管理员权限; 输入./mysqld_safe --skip-...

2019-03-05 15:37:25 628 0

原创 extract-text-webpack-plugin 不再支持 Webpack 4.3.0

问题描述 目前 extract-text-webpack-plugin 最新版本不支持 Webpack 4.3.0 版本. Webpack 4.2.0 一下可用。 目前从 extract-text-webpack-plugin issues 了解, 未来 extract-text-webpack-...

2019-02-27 14:31:46 1328 0

原创 解决import动态加载webpack打包错误

最近升级webpack4时(旧版本是3.5.1),打包时报错,具体错误描述见下图,错误不一致的可以离开了…(手动微笑) You may need an appropriate loader to handle this file type. | export var AsyncComponent ...

2019-02-18 18:05:20 3937 1

原创 Git修改提交记录中的用户名和邮箱

第一步 命令行执行: #!/bin/sh git filter-branch --env-filter ' OLD_EMAIL="错误的邮箱地址" CORRECT_NAME="正确的用户名" CORRECT_EMAI...

2019-02-13 11:25:27 1503 0

原创 关于Warning: setState(...): Can only update a mounted or mounting component.的解决方案

一、原因 在做项目的时候,控制台一直报一个错误。最初以为是脏数据导致的key重复问题,后来发现这个问题一直存在。细看,发现具体错误提示如下: 略经思考,脑子里首先闪现的问题原因是,setState异步函数在组件生命周期结束后异步抛出。经此设想,快速切换两个路由,此问题复现,即证明了猜想是正确的。...

2019-01-12 16:23:58 1155 0

转载 中国历史朝代歌:夏商与西周,东周分两段

夏商与西周,东周分两段。 春秋和战国,一统秦两汉。 三分魏蜀吴,二晋前后延。 南北朝并立,隋唐五代传。(五代有十国:南北汉、前后蜀,南平南唐吴闽楚。再加吴越) 宋元明清后,王朝自此完。 注:由夏启开创的父死子继的世袭制王朝,历史上称为夏代。这是中国历史上第一个王朝时代。不过,从司马迁开始,史学家们...

2018-12-20 20:23:44 9801 0

原创 cookie和token身份验证

1. cookie身份验证 用户输入登陆凭据; 服务器验证凭据是否正确,并创建会话,然后把会话数据存储在数据库中; 具有会话id的cookie被放置在用户浏览器中; 服务器验证凭据是否正确,并创建会话; 在后续请求中,服务器会根据数据库验证会话id,如果验证通过,则继续处理; 一旦用户登出,服...

2018-12-18 10:48:12 2170 0

转载 Mac使用ngrok内网穿透实现外网访问

转载出处:https://blog.csdn.net/tomcat_2014/article/details/68944066 1.为什么使用 web开发中,难免会遇到在某些情况下,我们必须借助外网才能调用某个API,然而,如果我们按照下面的方式来做,显得就很繁琐: a.在一个具有外网可访问的服...

2018-12-16 13:24:21 498 0

原创 写个随机生成函数拯救一下key(map,生成dom且没有key)

randomString(len) { len = len || 32; var $chars = 'ABCDEFGHJKMNPQRSTWXYZabcdefhijkmnprstwxyz2345678'; var maxPos = $chars.len...

2018-11-30 09:54:07 164 0

原创 React中使用highcharts绘制图表demo

import React from 'react'; import Highcharts from 'highcharts'; export default class extends React.Component { componentDidMo...

2018-10-30 17:29:42 2291 0

原创 Nodejs中使用nodemailer搭建邮件自动发送服务

在Nodejs中,使用nodemailer可以轻松实现邮件自动发送功能。 一、安装nodemailer包 npm install nodemailer --save 二、代码如下: const nodemailer = require("nodemailer&...

2018-10-14 00:07:04 2066 2

原创 JavaScript深拷贝踩坑小记

目录关于深拷贝然而,有坑!解决方案1. 结构化克隆算法2. lodash中的_.cloneDeep() 方法 关于深拷贝 关于深拷贝与浅拷贝的理解,这里不过多的进行描述。因为此前自己总结了一次深拷贝的常见方法,JSON.parse(JSON.stringify(obj)),jQury的$.exte...

2018-09-20 22:55:35 259 0

提示
确定要删除当前文章?
取消 删除