Hello-World
这是哪里 这里是小康博客Hexo版，此站将会替代曾经的博客。 搬迁缘由 首先要说明的就是我还是一个学生，目前所使用的服务器均是阿里学生机，这意味着24岁时就要享受不打折服务了。🤮 然而对于我这个没有收入的人来说，这简直时天文数字。 一开始也打算换成国外的服务器，但是每年也是100-300的支出，服务器在国外就意味着在国内要做一些优化，不然我这个“处女座心里”怎么能忍受的了。 经过再三考虑决定使用hexo+github搭建一个免费的博客，甚至域名都打算用GitHub免费的。但是速度吧。。。大家都懂得，我就不多说了。一开始觉得还可以，大概是缓存原因，于是写了几篇文章，突然发现一个问题：我的电脑不在身边怎么办。这样我就没法写文章了；或者长时间在外边，没有带电脑。后来一直没有找到一个好的解决办法，这个计划也就这么不了了之了。 知道昨天，发现了coding这个平台可以跟腾讯cloud studio配合使用。哇，我仿佛发现了一个新天地，我可以将代码传到coding，再用腾讯的studio实现云环境编写，就这样经过一晚上的试验终于成功了！ 😄 。 地址说明 本博客采用的地址是不加www的 ...
Hexo博客之butterfly主题优雅魔改系列
butterfly背景修改，透明度修改，卡片分类折叠等Hexo主题魔改。
HTML5中audio与video
音频 HTML5中提供的音频API标签为<audio></audio>，使用示例如： 1<audio src="野狼disco.m4a" controls></audio> 兼容写法 1234567<audio controls> <source src="resource/audio/OUTPUT.mp3" type='audio/mpeg'> <source src="resource/audio/OUTPUT.aac" type='audio/aac; codecs="aac"'> <source src="resource/audio/OUTPUT.ogg" type='audio/ogg; codecs="vorbis"'> 您的浏览器不支持，<a href=" ...
Github之Actions自动发布GitHub Release
前言 此文以node项目为例，目录存在package.json，其他项目如果参考本教程需自行创建json文件用于记录当前版本。 123{ "version":"1.1.1"} 上述代码仅作为JSON文件示例。 先来看看actions官方提供的发布demo 1234567891011- name: 创建GitHub Release id: create_release uses: actions/create-release@latest env: GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }} with: tag_name: tag的名称 release_name: 发布的名字 body: 发布的内容 draft: false prerelease: false 以上几个需要我们自己填写的只有tag_name、release_name、body。因此我们只需要动态获取这三个变量即可实现按照我们的需求进行发 ...
如何为评论系统快速添加表情
为你的Valine、Waline、Twikoo评论丰富表情吧。阿鲁小表情，哔哩哔哩表情····
三、移动端轮播图的实现
布局 1234567891011121314151617181920<div id="app"> <div id="swiper-container"> <!-- 幻灯片的结构 --> <div class="swiper-wrapper"> <div class="swiper-slide"><img src="./img/1.jpg"></div> <div class="swiper-slide"><img src="./img/2.jpg"></div> <div class="swiper-slide"><img src="./img/3.jpg"></div> <div class ...
Github之Actions自动发布npm包
前言 在将我们的源代码推送到GitHub时并希望他能自动构建并将包发布到npm。 其实做法也简单，大致思路：获取仓库源代码->安装插件->构建->推送 一、生成TOKEN 这一步很重要，在npm中生成自己的TOKEN。TOKEN类型一定要选择Automation，生成后将其保存，因为一会儿要在GitHub密钥中填写这个值。 二、配置仓库secrets 进入你的代码仓库，单击设置 点击Secrets，并新建一个键为NPM_TOKEN，值为上一步生成的TOKEN的密钥 三、编写构建配置 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748name: Node.js Packageon: push: branches: - masterjobs: publish-npm: runs-on: ubuntu-latest strategy: matrix: node-versi ...
四、Webpack其他补充
多页面打包 使用glob插件并通过 1yarn add glob html-webpack-plugin -D 配置 12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758/** * @description: * @author: 小康 * @url: https://xiaokang.me * @Date: 2021-01-02 17:18:46 * @LastEditTime: 2021-01-02 17:18:46 * @LastEditors: 小康 */const glob = require('glob')const path = require('path')const HtmlWebpackPlugin = require('html-webpack-plugin')const setMPA = () => { const entr ...
三、Webpack优化配置
性能优化 性能优化包含开发环境优化和生产环境优化。 开发环境 优化打包构建速度 优化代码调试 生产环境 优化打包构建速度 优化代码运行的性能 开发环境 HMR 即热更新：一个模块发生变化，只会重新打包这一个模块。 在devServer中开启 1234567891011{ devServer: { contentBase: resolve(__dirname, 'build'), compress: true, port: 3000, open: true, // 开启HMR功能 // 当修改了webpack配置，新配置要想生效，必须重新webpack服务 hot: true }} 样式文件 样式文件可以使用热更新，因为style-loader内部实现了 js文件 默认不使用HMR功能，需要手动修改支持HMR。且只能处理非入口文件。 12345678if (module.hot) & ...
