下雨の波比

Vue3 核心语法围绕响应式系统、组件化开发和组合式 API 创建，通过 <script setup> 简化模板编写，利用 ref 和 reactive 实现数据的响应式绑定，借助 computed 和 watch 处理派生数据和副作用。此外，Vue3 引入了更强大的生命周期钩子，大幅提升了开发效率和应用性能。 OptionsAPI 与 CompositionAPI Vue2 的 API 设计是 Options （配置）风格的 Vue3 的 API 设计师 Composition （组合）风格的 Options API 用于 Vue2 及之前的版本，通常用于组织 Vue 组件的代码。Options API 将一个组件分割成了几个部分，如data、computed、methods、watch等，使得组件的逻辑可以分而治之，易于理解和维护。但随着项目的复杂度增加，Options API 逐渐显示出一些不足之处，如代码重复、逻辑难以复用等。 Composition API 是 Vue3 引入的全新特性，它使用一种全新的方式来组织 Vue 组件的代码。与 Options...

在 Butterfly 主题下，使用 live2d 插件在右下角添加白猫。 首先安装模块，输入以下命令安装必要插件： 1npm install --save hexo-helper-live2d 安装白猫模型： 1npm install live2d-widget-model-tororo 打开站点配置文件 config.yml，搜索 live2d，按照如下注释内容指示进行操作： 1234567891011121314151617181920212223242526# Live2D## https://github.com/EYHN/hexo-helper-live2dlive2d: enable: true scriptFrom: local # 默认 pluginModelPath: assets/ # 模型文件相对与插件根目录路径 model: use: live2d-widget-model-tororo # 模型名字 scale: 1 hHeadPos: 0.5 vHeadPos: 0.618 display: ...

教程链接：Hexo侧边栏添加文章合集 侧边栏添加文章合集模块，可以提供一个系列文章的整体展示，便于导航到一个具体的内容 首先，在 \themes\butterfly\layout\includees\widget 目录下新建 card_collections.pug 文件，并写入： 12345678if theme.aside.card_collections.enable .card-widget .item-headline i(class=theme.aside.card_collections.icon) span=theme.aside.card_collections.title each item in site.data.collections.collections .collections-item-content a(href=item.url)=item.name 在 \themes\butterfly\layout\includees\widget\index.pug 文件中 page...

教程链接：Hexo小标题旋转风车设置 找到主题配置文件 _config.butterfly.yml 把 beautify 的 title-prefix-icon 处修改为 \f863 123beautify: enable: true title-prefix-icon: '\f863' 在 inject 的 head 处引入以下文件： 123inject: head: - "<style>#article-container.post-content h1:before, h2:before, h3:before, h4:before, h5:before, h6:before { -webkit-animation: avatar_turn_around 1s linear infinite; -moz-animation: avatar_turn_around 1s linear infinite; -o-animation: avatar_turn_around 1s linear infinite;...

教程链接：Hexo添加雪花动态效果背景 首先在 source/styles/js 目录下新建一个 snowflake.js 文件，然后将以下内容写入该文件，然后将以下内容写入该文件： 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106if((navigator.userAgent.match(/(phone|pad|pod|iPhone|iPod|ios|iPad|Android|Mobile|BlackBerry|IEMobile|MQQBrowser|JUC|Fennec|wOSBrowser|BrowserNG|WebOS|Symbian|Windows Phone)/i))) { //...

记录一下 Hexo 魔改过程，方便版本升级时快速修复 Hexo 添加看板娘点击跳转 至 Hexo 添加看板娘 Hexo 侧边栏添加文章合集点击跳转 至 Hexo 侧边栏添加文章合集 Hexo 小标题旋转风车设置点击跳转 至 Hexo 小标题旋转风车设置 Hexo 添加雪花动态效果背景点击跳转 至 Hexo 添加雪花动态效果背景 Hexo 修改字体点击跳转 至 Hexo 修改字体 Hexo 修改鼠标样式点击跳转 至 Hexo 修改鼠标样式

有时在 docker 中产生的数据，我们需要进行相应的备份和迁移到另一台服务器上，并在另一台服务器上进行数据恢复，docker 容器备份与迁移是在 docker 的镜像层级操作，我们介绍了三种容器备份与迁移的方法： 离线迁移 DockerHub 私有镜像仓库 首先我们需要将需要备份的容器打包成镜像。假设我们有一个容器，名为 nvidia/cuda:11.6.0-cudnn8-devel-ubuntu18.04，首先停止容器： 1docker stop nvidia_cuda 使用 docker commit 命令将该容器打包成镜像 1docker commit -m "nvidia_cuda" nvidia_cuda my_container:1.0 可以看到我们生成的镜像信息，已成功制作镜像 my_container:1.0 离线迁移镜像文件经常有在服务器之间传输的需求，为此 docker 提供了镜像打包和镜像加载的命令，docker save 命令可将镜像打包成 tar 压缩文件，使用示例 1docker save -o...

docker 是一个基于 Go 语言开发的开源容器化平台，旨在通过轻量级、可移植的容器技术加速应用程序的交付并提高资源利用率。它秉承“构建一次，运行任何地方”的理念，利用 Linux 内核特性如命名空间（Namespaces）和控制组（Control Groups, cgroups）实现高效的资源隔离与限制，确保每个容器拥有独立的运行环境。docker 提供了一系列工具来简化应用的打包、分发和部署过程。例如，Dockerfile 定义了应用及其依赖的构建指令，而 Docker Compose 则允许用户定义和管理多容器应用的服务。这种设计使得开发者可以轻松创建出轻量、便携且自包含的容器，极大提升了开发效率和应用的一致性。 应用容器（Application Container） 是 docker 的专业术语，指的是一种轻量级、自包含的软件包，它包含了应用程序及其所有依赖项，可以在任何环境中一致地运行。docker 容器的设计初衷就是为了让开发者能够“构建一次，运行任何地方”，即无论是在开发者的笔记本电脑、测试服务器还是生产环境，容器化应用的行为都是一致的。 总结来说，docker...

​filebrowser 是一个使用go语言编写的软件，功能是可以通过浏览器对服务器上的文件进行管理。可以是修改文件，或者是添加删除文件，甚至可以分享文件，是一个很棒的文件管理器，你甚至可以当成一个网盘来使用。总之使用非常简单方便，功能很强大。 参考链接： FileBrowser 官网 Github 链接 FileBrowser 安装以下介绍 File Browser 的 Windows 安装方法，首先下载桌面版 docker-desktop，在终端命令行拉取镜像： 1docker pull filebrowser/filebrowser:s6 可以在 Docker Desktop 中查看拉取的镜像： 在镜像界面点击运行按钮，进行容器配置： 指定容器名称为 fileBrowser，容器的端口为 8000，挂载卷添加三个挂载卷，前两个指定 filebrowser.db 和 settings.json...

本文讲述如何搭建 Butterfly 主题并快速美化我们的个人博客，好看的样式所产生的观感会让我们在阅读时有一种心情愉悦的感觉。这里，我们介绍一些简单的配置，更多的配置可以跟着官方配置的方法。许多你需要解决的问题都可以在 (Butterfly 主题官网)[https://butterfly.js.org/]找到解决方案。 导航目录 1234567891011121314# _config.butterfly.ymlmenu: 首页: / || fas fa-home 目录 || fas fa-list: 归档: /archives/ || fas fa-archive 标签: /tags/ || fas fa-tags 分类: /categories/ || fas fa-folder-open 娱乐 || fa fa-heartbeat: 音乐: /music/ || fas fa-music 图库: /gallery/ || fas fa-images 电影: /movies/ || fas fa-video 友链: /link/...