苏苏の休憩小屋

​ 哈喽！这里是苏苏吖~，在捣鼓音频转波形图的时候，在网上找了一堆的资料都不是很如意，所以就自己捣鼓琢磨了一下，可算是捣鼓出来啦，所以回顾一下过程。 🐱 音频转波形图的实现方式有很多种，并不唯一。 需求分析 ​ 简单描述一下就是需要将音频文件实时的转换成音频波形图呈现出来，我这里也没有找到什么很好的库，所以就自己参考着资料实现了一下。 效果的话，还算可以的吧。哈哈。 ​ 预览效果如下所示： 实现 ​ 下面来看看我的实现代码吧~useAudioVisualizer.js class AudioVisualizer { constructor(audioUrl, canvas) { this.audioUrl = audioUrl; this.canvas = canvas; this.context = new(window.AudioContext || window.webkitAudioContext)(); this.bufferSize = 4096; // 缓冲区大小 ...

🎀 哈喽，这里是苏苏吖~，苏苏又来更新文章啦！月光洒落窗台，有人得诗，有人得词，有人做文，有人谱曲… 我曾见过风 ​ 秋天，风是大地上的旋律，是微妙的情感在空气中流转。我曾见过风，见过它在秋叶间舞动，如一位优雅的舞者，将金黄的叶片轻轻抚摸。那轻柔的触感仿佛是大自然的温柔，用颤动的树叶述说着秋天的故事。 ​ 漫步在小径上，我感受到风的微风，轻拂着脸庞，如同柔软的羽毛轻轻触摸。枫叶纷纷飘落，随风而舞，如同一场自然的独舞。我曾见过风，吹拂过金黄的麦浪，让我感受到大地的丰收和生机。那一片片金黄，在风的引领下，跳动着宁静而又充实的乐章。 ​ 我曾见过风，穿越城市的高楼大厦，它在城市中流动，扬起街头的尘埃，却又带着清新的空气。风是城市中的音符，吹散了喧嚣，带来了宁静。我在楼顶眺望，看着远处的云卷云舒，感受到风带给城市的生命力。 ​ 山间，风吹草动，传来山花的芬芳。我曾站在山巅，俯瞰千山万水，感受到风的力量。风是山的诗，吹拂过每一片叶子，弹奏着大地的交响乐。我曾见过风，吹拂过湖面，湖水泛起涟漪，如同风在水面轻轻流淌。风与水交融，勾勒出一幅宁静而深邃的画卷。 ​ 秋天的风，是大自然的笔触，勾勒 ...

🎀 哈喽，这里是苏苏吖~，苏苏又来更新文章啦！月光洒落窗台，有人得诗，有人得词，有人做文，有人谱曲… 小雪 ​ 在小雪的时节，世界仿佛进入了一场梦幻的画卷。雪花纷纷扬扬地飘洒而下，翩翩起舞，轻柔地覆盖着大地，勾勒出一片银白的童话。这是大自然的魔法，一种不经意间的神奇，将平凡的景色点缀得如诗如画。 ​ 窗外，一片宁静。树梢上挂满了晶莹的雪珠，屋檐上铺满了银色的雪翘。整个世界都沉浸在这片宁谧的白色世界中，仿佛时间在这一刻凝固。寒冷的空气中，弥漫着雪的清新味道，让人心旷神怡。 ​ 小雪是季节的过渡，是冬天的序曲。大地渐渐冷却，冰雪的覆盖让人感受到一种宁静而祥和的氛围。寒风呼啸，却也带着冬日的温柔。这时节，家中的暖意格外珍贵，让人愿意静下心来，品味生活的美好。 ​ 走进乡间，田野在小雪的滋润下显得格外宁静。麦田已然金黄，雪花点缀在麦穗上，宛如珍珠般闪烁。农民们忙碌着，为冬季的来临做着准备，而这一片宁静的田园画卷，也是他们勤劳的见证。 ​ 小雪是一场自然的盛宴，是生命的细腻之处。每一片雪花都是独一无二的艺术品，它们在空中飘舞，轻盈而灵动，如同天使的芬芳。抬头仰望，雪花在寂静的夜空中翩然飘 ...

哈喽，这里是苏苏吖~，在上篇文章中已经将搭建博客所需要的环境搭建完毕，接下开始创建项目，开始啦！ 🌼 注：在进行下文的步骤时，请先确保已经按照上篇文章的步骤操作完成。 基于Hexo搭建个人博客（一） | 苏苏の休憩小屋 (luckysusu.top) 创建项目 1、新建一个文件夹用于存放博客文件，然后在文件夹中打开Windows Power Shell窗口，输入hexo init命令初始化项目。 $ hexo init 项目名 2、项目初始化完成后，通过vs code打开demo文件，ctrl+~打开控制台面板，输入npm install安装项目所需依赖 $ npm install 3、项目依赖安装完成后，可以查看目前的文件目录结构 .github：git相关文件 node_modules：项目依赖包 scaffolds：文章模版 source：文章文件和文章资源文件 theme：主题 _config.landscape.yml：主题配置文件 _config.yml：根配置文件 package.json：项目描述等信息 4、运行hexo server启动项目 $ he ...

哈喽，这里是苏苏吖~，在上篇文章中已经将项目，（域名）[可选]，主题都准备好啦，接下来开始基础配置吧，开始啦！ 🌼 注：在进行下文的步骤时，请先确保已经按照前文的步骤操作完成。 基于Hexo搭建个人博客（一） | 苏苏の休憩小屋 (luckysusu.top) 基于Hexo搭建个人博客（二） | 苏苏の休憩小屋 (luckysusu.top)

哈喽，这里是苏苏吖~，从这篇文章开始，会一一开始回顾苏苏通过Hexo搭建个人博客的全过程，期间遇见的一些bug及解决方式也会逐一描述，那么，话不多说，开始搭建个人博客啦。 🍀 接下来的搭建主要面对Windows系统。因为苏苏在搭建过程中使用的也是Windows系统。 环境预设 博客搭建环境如下： 操作系统：Windows10&Windows11 Node.js Git 博客框架：Hexo 编辑器：Visual Studio Code（Webstorm亦可） 静态部署：GitHub&&Gitee均可 服务器：阿里云服务器&腾讯云服务器（可选，有服务器需备案） 域名：推荐阿里万网注册（可选，github部署或Gitee部署均提供了访问地址，域名可配可不配） Node.js安装 nvm安装普通安装 🍓 nvm安装方式请参见文章：nvm-nodejs版本控制工具 | 苏苏の休憩小屋 (luckysusu.top) 🍓 普通安装方式较为简单，在node.js官网下载LTS的版本压缩包或exe文件安装即可，安装 完成后同理通过node -v检查版本是 ...

由于node.js版本一直处于迭代更新状态，而工作中的node.js的版本需求又会因项目不用而存在差异，因此，nvm对于一位前端工作者来说是在太好用了。 nvm 全称 node.js version manage，是一个node.js的版本管理工具包，可以便捷安装和切换不同版本的node.js。 安装nvm 下载nvm 需要注意的是，nvm的版本截止本文发布时已更新到V1.1.11版本，本文介绍的nvm版本也是基于此版本，后续不再解释版本。 下载地址：Releases · coreybutler/nvm-windows (github.com)，此地址是github上的nvm-windows官方下载地址，如无梯子，请移步下面的下载方式 下载地址：https://pan.baidu.com/s/1MxC2KH2Cf4Oe5VCnRClyjQ?pwd=susu 提取码：susu 安装nvm 此处分为两种， 如果有梯子在官网下载的nvm-setup.exe，请直接点击安装 如果没有梯子，下载的压缩包，请先解压，然后运行nvm-setup.exe 双击运行安装程序后，按如 ...

哈喽！这里是苏苏吖~，最近在做项目时，遇到很多图形图表的应用，但是一个一个的去引用显得好笨，再请教了 唐志远 大佬后得到一些感悟，在这里再次回顾一下封装的过程。 🐱 封装方式有很多种，我所做的封装仅仅是方便我自己在项目中使用，所以主要以记录为主，讲解不多。见谅 开始之前 ​ 首先，虽然说是在vue3的项目中做的封装，但是基本的封装逻辑是大差不差的。而在我接下来的封装中，封装的逻辑基本是按照 引入依赖——创建钩子函数——定义响应式引用——定义渲染函数——返回对应对象 来进行的。 ​ 好啦，请确保已经创建好项目，并安装好了依赖，此处封装的图表库依赖来源于Echarts图形图表库 $ npm install echarts --save 正式开始 不说废话，直接上代码！ 首先是useEcharts函数。useEcharts.js import { ref } from 'vue';import * as echarts from 'echarts';//定义useEcharts函数，接受chartDom和opt ...