在 iOS 中调试 Safari 浏览器

打开模拟器, 在模拟器的 safari 中属于一个地址
打开 safari, 启动开发者模式 > 勾选在菜单栏中显示 “开发” 菜单

在开发中选择

这样既可测试不同系统下的 safari 显示

说一下出现这个问题的场景, 在 ios 15.0 场景下 100% 高度在手机滑动之后, 底部会出现空白(这大概率是 ios 15.0 的一个 bug)
验证地址 : https://vant-demo.wulicode.com/misc/height

因为 vConsole 工具也出现了这个问题

因为页面的底部出现了空白, 参见 1 图第一个屏幕的默认样式, 在这种情况下存在的一个 bug, 这种样式来源于 vue 默认框架中对于高度的定义

FAQ

FAQ

原文地址 : https://juejin.cn/post/6844903494386712589
两个月都没有更新自己的博客了，可能自己一直在福州，网络差的原因都没心情写了。一回到广州，学习的心态又回来了。😄
响应式布局的单位我们第一时间会想到通过rem单位来实现适配，但是它还需要内嵌一段脚本去动态计算跟元素大小。 比如：

原文地址 : https://www.cnblogs.com/igeekfan/p/introduction-jwt.html

原文地址 : Flex 布局教程：语法篇 - 阮一峰的网络日志
网页布局（layout）是 CSS 的一个重点应用。

布局的传统解决方案，基于盒状模型，依赖 [display](https://developer.mozilla.org/en-US/docs/Web/CSS/display) 属性 + [position](https://developer.mozilla.org/en-US/docs/Web/CSS/position)属性 + [float](https://developer.mozilla.org/en-US/docs/Web/CSS/float)属性。它对于那些特殊布局非常不方便，比如，垂直居中就不容易实现。

2009年，W3C 提出了一种新的方案—-Flex 布局，可以简便、完整、响应式地实现各种页面布局。目前，它已经得到了所有浏览器的支持，这意味着，现在就能很安全地使用这项功能。

Flex 布局将成为未来布局的首选方案。本文介绍它的语法，下一篇文章给出常见布局的 Flex 写法。网友 JailBreak 为本文的所有示例制作了 Demo，也可以参考。
以下内容主要参考了下面两篇文章：A Complete Guide to Flexbox 和 A Visual Guide to CSS3 Flexbox Properties。

对于 IOS 应用的审核, 在进行包提交审核的时候经常会遇到加载 Vue 开发页面出现白屏的情况, 遇到此情况我们将 Vue 页面支持全球加速, 如果是 oss , 开启静态访问, 全球访问

服务器使用 aliyun 弗吉尼亚 进行测试

未加速

已加速

语雀镜像 : 部署测试加速 ,点此 提问

jQuery 中无法设置selected=”selected” 正常工作

设置语句[NOT Work]:

文章地址 : yarn的安装和使用 - 掘金

官方链接 : 错误处理

原文地址 : How to Parse URL in JavaScript: hostname, pathname, query, hash

如果需要查看更完善的文档请查看 MDN : URL API - Web API 接口参考 | MDN
统一资源定位符，缩写为URL，是对网络资源(网页、图像、文件)的引用。URL指定资源位置和检索资源的机制(http、ftp、mailto)
举个例子，这里是这篇文章的 URL 地址：

这里主要使用前端来生成 pdf, 但是由于浏览器安全性的问题会导致浏览器不允许读取图片, 以下这几个步骤则可以生成 pdf

个人认为, 如果不是对 icon 要求特别高可以在 header 中放置一个 png 即可

Client *

clientHeight : 元素内部的高度(单位像素)，包含内边距，但不包括水平滚动条、边框和外边距
clientWidth: 表示元素的内部宽度，以像素计。该属性包括内边距 padding，但不包括边框 border、外边距 margin 和垂直滚动条

首先确保机器上安装了 epel(多了一个源选项)

语法

Css 设定变量

Sentry 是一个日志平台，分为客户端和服务端，客户端(目前客户端有Python, PHP,C#, Ruby等多种语言)就嵌入在你的应用程序中间，程序出现异常就向服务端发送消息，服务端将消息记录到数据库中并提供一个web节目方便查看。Sentry由python编写，源码开放，性能卓越，易于扩展，目前著名的用户有Disqus, Path, mozilla, Pinterest等

• 性能监控(trace)
• 错误定位(source-map)
• 性能监控

又名 : 雅虎网站优化 30 条军规
原文地址 : Best Practices for Speeding Up Your Web Site
Yahoo!的 Exceptional Performance 团队为改善 Web 性能带来最佳实践。他们为此进行了 一系列的实验、开发了各种工具、写了大量的文章和博客并在各种会议上参与探讨。最佳实践的核心就是旨在提高网站性能。
Excetional Performance 团队总结出了一系列可以提高网站速度的方法。可以分为 7 大类 35 条。包括内容、服务器、cookie、CSS、JavaScript、图片、移动应用等七部分。

本项目是基于 Web 开发最佳实践 的扩展

1. 证书错误

证书生成地址见 : iOS 证书及描述文件制作流程
如果证书类型存在错误, 则会出现以下的问题, 这里应该使用开发证书

• 本项目使用 yarn 进行包管理
• 全局安装的命令为 jsdoc

本项目是基于 Web 开发最佳实践 的技术扩展

扩展博文

• 哆啦斯基周

语雀镜像 : Readme ,点此 提问

JSDOC 是一个 API 文档生成器，你只需要在代码中添加特定格式的注释，它就可以从注释中为你生成 HTML 文档。

1. Uncaught Error: Invariant failed

Uncaught Error: Invariant failed , You should not use <Route> outside a <Router>
参考地址 : https://www.freeformatter.com/url-parser-query-string-splitter.html

出现原因: 系统中存在两个实例, 例如

这里记录常见的包管理相关的错误解决方案

pnpm 的优势不用多说, 懂得自然了解了, 不懂的去官网看下他们的介绍 项目初衷 | pnpm 这里主要的目的是使用 pnpm 替换掉 yarn 和 npm

• npm 是 node 的包管理工具, 所以我的理解是 node 是基础, 需要 npm 必须要有 node
• yarn 作为 npm 的一个包, 必须要有 npm , 才能够使用 yarn
• 然而 node 的版本也可以支持切换, 这样再切换 node 的时候则需要使用到 nvm , 而 nvm 是依赖于 npm 和 yarn 的.

这样造成的依赖循环逃脱不了轮回, 就会导致东西关联较多
在我了解了 pnpm 之后他可以很好的解决以上问题并且还有它自己独到的优势

• 纯净安装, 依托于 brew
• 可以管理全局 node , 并支持自动安装
• 包管理使用软链接方式, 不必在多项目之间重复下载占用磁盘空间

所以就打算用他替换掉 nvm, yarn, npm 这些工具, 仅仅使用一个即可

Npm

TaoNpm 的更新流程示意图:

为什么要换源? npm 官方站点 http://www.npmjs.org/ 并没有被拦截,但是下载第三方依赖包的速度由于和外网联通的限制, 速度不能满足实际的使用需求.为了加速访问, 我们可以使用镜像来进行访问
国内有几个镜像站点可以供我们使用

• https://npmmirror.com
• http://www.cnpmjs.org/

速度非常快,镜像站会实时更新,为我们节省了好多时间.

1. 空对象在数组中不认为是空