blog
blog copied to clipboard
Developer27149
My blog on Next.js and TypeScript.
前端工程化中，使用 babel 对新语法和 API 预置 polyfill 是非常流行的做法之一，但之前笔者对这个过程和其中使用到的插件不够了解，因此在网上搜寻了一些博客和知识分享，学习一番，再次总结一下。 ## 前言 本文将对`babel7`的语法转换和`polyfill`的相关知识进行分析，主要内容为`@babel/preset-env`和`plugin-transform-runtime`，Babel 7.4 之后不再推荐使用`@babel/polyfill`。 ## Preset-env > Preset-env 会污染全局环境。 babel 7 版本推荐使用`@babel/preset-env`代替以往的诸多`polyfill`方案，现今我们可以使用`preset-env`简单地实现语法和功能特性的需求。 > @babel/preset-env is a smart preset that allows you to...
--- description: 第一次看到这本书的时候,记得是几年前在桂电图书馆里,断断续续看了六章,后来便离开了学校.现在买了纸质书打算重新看一遍,这里记录下阅读随想. cover: https://de4965e.webp.li/blog-images/2024/08/b87f621e1268c6961af16511854038a5.png --- # 函数式编程简介 > 函数要小,要更小. 函数式编程,远离外部环境的依赖,隔绝突变与状态. 数学的函数定义中,函数必须接收一个`参数`,返回一个值.函数根据接收的参数运行.给定的参数下,返回值是不变的. `JavaScript函数式编程`基于数学函数及其思想进行发展.运用函数式的范式进行开发能创造可缓存和可测试的代码库. > 简单分辨函数与方法 - JS,不必深究 window 和 global 对象. - 函数: 一段通过名称可调用的代码 - 方法: 通过名称且关联对象的名称被调用的代码 函数的引用透明性指的是,函数对相同的输入返回相同的值.不依赖全局数据的函数,能够自由地在多线程状态下运行,全程无锁.并且函数是`可缓存`的,合理运用这一点,可以节省大量重复计算的资源消耗和时间消耗. > 引用透明性是一种哲学...
--- description: 最近一周的状态奇差，大概是跟失业的心理压力有关吧。于是看了看奥运会的篮球比赛，为日本男篮感到骄傲。 cover: https://kslsports.com/wp-content/uploads/2023/11/4971174.jpg --- OK！继续来分享上一周接触到的一些讯息！ ## IIElevenLabs >[[ElevenLabs: Free Text to Speech & AI Voice Generator | ElevenLabs](https://elevenlabs.io/)](https://elevenlabs.io/) 这是一个 AI 音频平台，可以使用 AI 音频平台创造最真实的语音。我使用这个平台为`GitBatch`创建了一段视频的音频，有兴趣的可以去看看:[[I create a small project to...
--- description: 飞机耳 + 玉足 cover: https://cdn.jsdelivr.net/gh/Developer27149/uPic@main/uPic/image-20240617012026938.png ---  OK！继续来分享上一周接触到的一些讯息！ ## Dozer  [Mortennn/Dozer: Hide menu bar icons on macOS](https://github.com/Mortennn/Dozer) 是一个隐藏`macOS`菜单栏图标的开源程序，笔者体验下来内存占用为`45 M`左右，比此前自己使用的同类应用都小。 ## NanaZip  [M2Team/NanaZip: The 7-Zip...
--- description: 我喜欢 Tanstack query`但是在使用过程中遇到了 mutation 之后自动 invalidate 数据的问题，于是搜索到一篇博客，本文是这篇博客的翻译内容。 cover: https://images.unsplash.com/photo-1515879218367-8466d910aaa4?q=80&w=2669&auto=format&fit=crop&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D tags: - tanstack query - frontend --- `查询`（Query）和`变更`（Mutation）就像是一枚硬币的两面。`查询`（Query）定义了一个异步资源用于读取，这通常来源于数据获取。而`变更`（Mutation）则是用于更新此类资源的操作。 当一个`变更`（Mutation）完成时，它很可能会影响`查询`（Query）。例如，变更一个`issue`很可能会影响`issue`列表。因此，有些人可能会觉得奇怪，为什么不把`Query`和`Mutation`关联起来？ 原因其实很简单：`TanStack Query`完全没有主观地要求你如何管理自己的资源，并非每个人都喜欢在`mutation`之后重新获取数据。 有些情况下，我们希望将`mutation`返回的数据手动放进缓存中，以避免一次网络请求。此外还有很多不同的方法来执行`invalidate`（无效化）操作。 > Tanstack Query 将 query 的数据缓存起来，开发者可以通过 invalidate...
--- cover: 'https://pbs.twimg.com/media/GNNlgVjbQAAu3eu?format=jpg&name=large' description: '喵，今天天气预告' ---  OK！继续来分享上一周接触到了一些讯息！ ## Node.js CLI Apps Best Practices  [lirantal/nodejs-cli-apps-best-practices: The largest Node.js CLI Apps best practices list ✨](https://github.com/lirantal/nodejs-cli-apps-best-practices) 是一个指导性的仓库，主要介绍了开发`Node.js`命令行程序的最佳实践，如果你也需要开发命令行程序，非常推荐学习一下。 ## 速通 TypeScript [joye61/typescript-tutorial:...
--- description: OK！继续来分享上一周接触到的一些讯息！ cover: https://de4965e.webp.li/blog-images/2024/08/a41c26d458c29dc4366d8c52a3a712ff.png --- OK！继续来分享上一周接触到的一些讯息！ ## 2.5D 图标资源站  [Isocons](https://www.isocons.app/) 上分享了很多 2.5D 的 icon，设计师或者独立开发者或许可以看看这样的设计和图标是否能应用到某些产品中去。相对于传统的平面图标来说，使用这种风格的图标会有一种耳目一新的感觉。 ## Cloudflare IndexNow 如果你将应用部署到 Cloudflare 上，那么就可以了解一下 IndexNow 这个工具。IndexNow 可以让搜索引擎快速发现并索引你的新内容或更新。它不仅提高了网站的SEO效果,还节省了爬虫的资源。 > 当使用 Cloudflare 的站点更改内容时，Crawler Hints...
--- description: 最近面试时被提问到 TypeScript 相关的知识，其中一个问题就是：什么时候应该在 TypeScript 中使用 never 和 unknown。 cover: https://de4965e.webp.li/blog-images/2024/09/1d13fb693096a714f5a96a44fc567a22.png ---  最近面试时被提问到 TypeScript 相关的知识，其中一个问题就是：什么时候应该在 TypeScript 中使用 `never`和 `unknown`。 笔者觉得自己没答好，于是再次学习了相关知识分享下来。本文不是 TypeScript types 的科普，所以别着急，只需一步一个脚印前进即可。 ## TypeScript 类型浅谈 首先，我们要明确什么是 TypeScript...
--- description: 这篇周刊非常特殊，特殊之处在于我开发了一个页面来专门写和改博客文章。 cover: https://de4965e.webp.li/blog-images/2024/08/3274f7e3862fe0c492b1ef8a5118e8cb.png --- Hello 大家好，下面为大家介绍上周笔者接触到的一些新的讯息。 ## React 组件 有时候我不需要完整的 React 组件库，而是仅安装特定的组件。下面是我在日常开发中发现的`react 小而美组件`: - [React Select](https://react-select.com/home) 选择器组件，API 非常简洁，但是可扩展性做得很好 - [react-hot-toast - The Best React Notifications in Town](https://react-hot-toast.com/) 通知信息组件，小巧易用...
--- description: 一团乱麻 cover: https://de4965e.webp.li/blog-images/2025/05/1c4504983b52ca660a417bccbc044874.jpeg ---  2025年05月09日18:54:56 南京禄口机场 13 号登机口。 随便写写一些想法，想到哪里写哪里。 我的周刊上次更新是 53 天之前，我还以为是半个月前，这又是我半途而废的一件事之一？ 我和我关注的前前前司的 CTO 大概前后相差不大的时间一起开始写周刊，但是人家的周刊数量已经是我的三倍。 🤣 笑哭，做一件事情能做好的关键之一：持之以恒。 我会继续做这件事情，周刊不会停。 我入职了这家公司算起来两个半月了，一开始是第三方的外包合同，再到某种特殊形式的新合同，这份合同最让我满意的是工作的性质。 谢天谢地，我终于可以体验一下远程开发的岗位了，尽管有一些曲折和折衷的东西，最后的结果还不错。 上一个月，花了很多时间处理搬家和租房的琐事，最终还是找到了一个还不错的房子租下来了。工作之余的时间写了一些项目，时间上就不太够去了解新东西和写周刊，当然也需要一点时间陪家人，也花了一点时间玩了 LOL。 这一个月写了一些代码，算是真正地经历了整个完整的全栈开发流程，这段经历堪称弥足珍贵。 如果不去做一些东西，不参与到核心的开发中来，不经历这些场景，我的自我成长是非常慢的。 无论你认可与否，有些人能够快速进步，效率是普通人的几倍。而我就是普通人，甚至是有些懒惰，经常间歇性停下的普通人，我做了一些东西，但却没有坚持下去。 到现在，我手头半途而废的东西不少。 五个。...