vue-router配置path为空时的坑 当 vue-router 配置 path 为空时页面无法访问当 vue-router 为如下配置时,默认 path(配置成’’)的页面会无法访问: 123456789101112131415161718192021return [ { path: "/a", children: [ { path: "/b&qu 2022-01-07 前端 #Vue
H5打开/下载APP方法汇总 H5 打开/下载 APP 方法汇总总结了一些在移动端 Web 环境下打开/下载 APP 的常用方法,在做运营活动的时候很有用处。(注:本文讨论的内容不包括使用第三方产品实现) 打开/下载 APP不论是打开还是下载 APP,其底层实现方案是固定的几种,根据其特性设计相应的交互跳转逻辑是提高用户体验和转化率的主要手段。 打开 APPscheme URL最常见的打开 APP 2022-01-04 前端 #移动端
performance.getEntries获取资源顺序问题 背景在使用 performance.getEntries 统计性能指标时,之前一直没有关注过数组中资源排序的顺序。由于所有的资源都是异步加载的,那么他里面的性能数据是按照请求发起的时间排序,还是按照结束的时间排序呢? 代码测试假设有两个接口 /api1 和 /api2,前端按先后顺序依次发起 /api1 和 /api2,同时后端保证 /api2 先 2021-12-28 前端 #监控
TS的鸭式辨型法 所谓的鸭式辨型法就是像鸭子一样走路并且嘎嘎叫的就叫鸭子,即具有鸭子特征的认为它就是鸭子,也就是通过制定规则来判定对象是否实现这个接口。 123456789interface LabeledValue { label: string;}function printLabel(labeledObj: LabeledValue) { console.log(labele 2021-12-28 其他 #Typescript
GitlabCI配置only-except的坑 背景之前在配置 .gitlab-ci.yml 时,当我们需要制定某个任务在特定情况执行时会这么配置: 123job: only: - /^release-.*$/ 这段代码的意图是当触发的 branch 和 tag 满足正则时则执行这个任务。 类似的配置在我们公司的 Gitlab(版本 13.2)中能与预期一致正常执行。 但我在 gitlab.com 中部署自己的博客时发现,当我创建满足 2021-12-26 运维 #CI/CD
使用GitLabCI+Docker部署博客 背景起初本站点源码方式在 GitHub 上,后来希望通过 CI/CD 的方式能够时博客能够自动化部署。 同时又想要使用 Docker 这种容器化方案,使我的服务器能够更加方便部署其他应用。 经过调研 GitHub 虽然可以通过 Actions 的形式将代码进行发布,但一般都是发布到 GitHub Pages 上。 如果想要使用 Docker 并且能够自动发布的话,需要在脚本中配置连接到我 2021-12-24 其他 #CI/CD #Docker
从头开始搭建自己的博客 起因其实在很早之前就使用过 hexo 搭建了一套博客,部署在了 GitHub Pages 上,但由于大家都懂的一些原因导致站点经常访问不上或者速度很慢,后来也没有继续维护下去,后续的文章都集中发到了公司内部的空间中。 随着技术文章和博客积累的越来越多,终于下定决心要好好整理一下自己的知识体系,并把内容放到一个属于自己的平台上,于是就又有了自建博客站点的打算。 正好遇到双十一阿里云服务器搞活动,就花 2021-12-19 其他 #部署 #服务器
git本地账号和远程仓库账号不一致 由于本人电脑连接了多个 git 仓库,每个仓库对应的账号名称都不一样,导致推送到远程仓库的提交无法关联到远程账号。 关联成功时,可以看到提交者的头像,且能够直接点击名字进入到对方主页。如果不成功的话头像会无法加载且点击名字只能发送邮件。 简单测试了一下他的匹配规则,发现只有当 user.name 和 user.email 都完全匹配时才会正确关联。 顺便附上修改 git 配置的常用命令: 123 2021-11-16 其他 #git
升级webpack5对前端性能指标的影响 背景介绍目前公司部分前端 SPA 项目升级了 webpack5,在做性能报表的时候发现基于 webpack5 构建的项目在 domInteractive 这个指标上与基于 webpack4 的项目有很大的提升。在业务代码类似的情况下,判断是 webpack5 在哪方面做了默认的优化导致了这一提升。 指标 webpack4 webpack5 domLoading(dl) 347 241 2021-11-03 前端 #webpack
基于D3实现的选项式树状图生成器 基于 D3 的选项式树状图生成器,通过简单的数据计算和图形选项,帮助业务方快速实现一个 D3 树状图结构,无需关心展开收起逻辑,通过配置均能够快速实现。 核心模块核心模块由容器,树组件,工具库组成。 容器模块主要负责为树状图提供显示容器,以及全局的交互,例如缩放,移动。 数组件提供了一个基类,并封装了通用的绘制流程,业务方通过重写核心计算方法,并通过图形配置达到自定义数图样式的效果 工具库提供了计 2021-10-29 前端 #数据可视化 #D3