Sienna's Blog

断更了一段时间，时间过得真快啊～已经入职新公司好几个月了，博客不能落下，把之前的面试总结分享一下～坐标杭州，让我们一起看看三年前端都面了些啥吧 我个人的习惯是在开始面试前先把知识点粗略的过一遍，笔试题只做最经典的那些题目（比如有效的括号，还有根据每项的 parent_id , 生成具体树形结构的对象）全都记录下来。每次面试遇到的问题再补充到文档里。面多了也就能知道哪些问题是高频问题，这类问题要完全把细节搞懂，面试的时候才能自然流畅的完整回答，不怕刨根问底。基础问题一般都在最前，这关过了就能到项目相关的部分了。 项目相关的也就是最最最重要的部分！面试官基本会围绕一些你在项目经历中的关键词进行提

npm ERR！integrity checksum failed when using sha1: wanted xxx but got xxxx 今天构建失败的时候看到一行报错 npm ERR! sha1-ixxxxxxxxo= integrity checksum failed when using sha1: wanted sha1-ixxxxxxo= but got sha512-xxxxxxxxxg== sha1-2xxxxxxxxxxx0=. (7610 bytes)仔细查看日志内容，意思是说当前的 sha1 值 和目标不一致，

# 初识 React Slick react-slick 是一个 React 组件库，用于创建响应式的轮播组件。它基于 Slick Carousel 库，提供了丰富的 API 和灵活的配置选项，让我们可以轻松地在 React 应用中实现各种滑动效果。 因为官方貌似没有出中文文档，所以就自行翻译了一版，如有问题欢迎指出～ # 快速上手 安装 React-Slick npm 安装：npm install react-slick --save yarn 安装：yarn add react-slick 安装轮播组件样式 npm install slick-carousel --s

刷掘金的时候偶然看到一个大佬的博客用的是 hexo 的 ShokaX 主题，很合我的眼缘。。正好之前的博客经常出问题，我用起来非常困难。。而且服务器也快过期了。。没有了新用户优惠。。续费价格高昂。。于是慢慢开始了我的迁移计划。。 安装部署 hexo 可以看官方文档，整个流程下来还是比较顺利的，所以就写一下踩的其他坑吧 # 图片加载不出来 原本我是把图片放在文件里面的，但是加载有问题，看了一堆方案后，决定还是自己搞个阿里云图床吧。 配置 oss 图床我参考的是这篇文章（菜鸟级 真的很详细 很适合我） https://blog.csdn.net/dingyuzhi&#

# 1. Recoil 简介 # 1.1 什么是 Recoil Recoil，是一个由 Facebook 出品的 React 状态管理库。想象一下，你在构建一个复杂的前端应用，状态管理就像是一场混乱的战场，而 Recoil 就是你的战术核弹，能够精确打击目标，让你的应用状态井井有条。 Recoil 的设计理念是 “零样板代码”，它让你能够以声明式的方式管理状态，同时保持组件的纯净和高效。就像是一个高效的管家，Recoil 帮你打理好家中的一切，而你只需要享受家的温馨。最近在项目中高频使用到它，一定要写一篇文章分享！ 以下是 Recoil 的一些核心概念和特性：recoiljs 中文文档 #

# 1. 什么是事件循环机制？ JS 中的事件循环（Event Loop）是一种用于管理和调度异步任务执行的机制。它使得 JS 可以处理异步操作，如定时器、事件处理、网络请求等，而不会阻塞主线程的执行。 # 2. 说一下什么是宏任务微任务，为什么要定义这两种任务类型？ 宏任务（macro tasks）和微任务（micro tasks）是 JavaScript 引擎中用于管理异步任务执行顺序的两种任务类型。 宏任务（Macro tasks）： 是指那些需要在主线程中执行的任务，它们包括但不限于： 定时器任务（Timers）：通过 setTimeout、setInterval 创建的任务。 I&

internal/modules/cjs/loader.js:1131 throw new ERR_REQUIRE_ESM(filename, parentPath, packageJsonPath); ^ Error [ERR_REQUIRE_ESM]: Must use import to load ES Module: /Users/muki/.nvm/versions/node/v14.21.3/lib/node_modules/nrm&#x

前端开发常见的几种设计模式： 观察者模式 描述：一个对象（称为主体）维护其依赖项列表（观察者列表），当对象状态发生变化时，它会通知所有观察者。 应用场景：事件监听、数据绑定等。 单例模式 描述：确保类只有一个实例，并提供全局访问点。 应用场景：全局状态管理、日志记录器等。 工厂模式 描述：定义一个创建对象的接口，但允许子类决定要实例化的类。 应用场景：组件或对象的创建。 这次我们主要聊聊非常常用的发布订阅。 发布 - 订阅模式又被称为观察者模式，它是定义在对象之间一对多的关系中，当一个对象发生变化，其他依赖于它的对象收到通知。在 javascript 的开发中，我们一般

# npm/yarn 报错：getaddrinfo ENOTFOUND registry.nlark.com 在 jenkins 打包的时候遇见以下报错： error An unexpected error occurred: "https://registry.nlark.com/@ctrl/tinycolor/download/@ctrl/tinycolor-3.4.0.tgz: getaddrinfo ENOTFOUND registry.nlark.com". 将 yarn.lock

首先，分析原始需求：点击导出为 PDF 文件时，弹出一个 Modal 框，预览生成的 PDF 文件，然后点击生成后下载 PDF 文件。 # 1. 预览时的文件是图片 or PDF or iFrame？ 感觉预览图片会简单一点，还可以放大。那就用 dom-to-image 对 DOM 元素进行截图吧，然后上传图片 url 到 oss，在预览窗口预览图片。 # 2. 下载时如何进行分页下载？ 思路是将 DOM 图片按固定尺寸分批次调用 pdf.addPage () 和 pdf.addImage () 方法生成 pdf 页面并插入剪切后的图片，如此循环操作，直至将整张图片遍历完毕后结束，最后调用 p