简介随着Vue2.x版本的停止更新维护，Vue3版本的迭代更新，新版本的相关生态也逐渐出现在大家的视野中。
其中，就包括Vue的新一代状态管理库 Pinia。
在Pina之前，我们一个复杂的应用通常是用Vuex来管理状态的，其中Vue2.x的版本对应的Vuex版本是Vuex3.x，而Vue3的版本对应的Vuex版本是Vuex4.x。
Pinia其实最初迭代的版本是Vuex5.x, 主要内容是设计及重构状态管理以适用于 Composition API，其设计原则跟思想与 Vuex 保持一致。所以最后将Pina作为新的推荐方案来代替Vuex。
Tips:
虽然Pina开始是要适用于Composition API，但作者初心也是同时支撑Vue2.x和Vue3.x，所以无论你的Vue是哪个版本都可以愉快的使用Pinia。
为什么要使用Pinia在Vue3中，我们通常用ref或reactive来定义数据，所以会有同学说，我用如下方法定义并共享全局数据也可以做到状态管理：
123export const state = reactive({})// 或者export con ...
123456789<!doctype html><html> <head> <meta charset="UTF-8" /> <title>Hello World!</title> </head> <body></body></html>
在前端开发中这是我们最常见到的html模板。我们知道，在html5中，我们需要在第一行标注<!DOCTYPE html>。这篇文章主要介绍下<!DOCTYPE html>的前后今生。
<!DOCTYPE html>HTML 的起源HTML（超文本标记语言）由蒂姆·伯纳斯-李（Tim Berners-Lee）在 1991 年发明，最初是为了简化信息在互联网中的发布与分享。随着 HTML 规范的不断更新和扩展，Web 浏览器的行为也变得越来越复杂。早期的 HTML 文档通常不需要 <!DOCTYPE> 声明，浏览器根据自己的规则解析这些文档。
标准化 ...
前言随着2022年末GPT3.5的发布，确实开启了AI领域的新篇章，各类模型如雨后春笋般层出不穷，前几天光逛github的时候发现了一个有意思的开源项目，即ChaTTS。
在当今的数字时代，文本到语音（Text-to-Speech, TTS）技术已经成为增强用户体验的重要工具。从语音助手到虚拟客服，再到无障碍阅读，TTS 技术的应用无处不在。
而ChatTTS就是用于对话场景的文本转语音，自己使用代码测试了下发现输出的语音文本还是较为自然的。这篇文章会介绍ChatTTS这个项目及目前其开源版本的一些不足。
ChatTTS官网地址： https://chattts.com/zh
github地址： https://github.com/2noise/ChatTTS/
简单介绍： ChatTTS是专门为对话场景设计的文本转语音模型，例如LLM助手对话任务。它支持英文和中文两种语言。最大的模型使用了10万小时以上的中英文数据进行训练。在HuggingFace中开源的版本为4万小时训练且未SFT的版本。
（ps: 开源版本作者为了规避风险，对输出的语音内容增加了少量额外的高频噪音，并用mp3格 ...
背景大多数项目中要封装对应的业务组件来提供给对应的用户使用。所以基于现有工程的技术框架封装了一系列的组件，并上传至私服，对外提供并使用。
封装组件的过程不多赘述，大家可以自行查阅资料或者参考此文档来进行封装（Vue封装组件并发布到npm仓库）。
在此步骤之后，通常我们就会在现有工程通过 npm install xxxx 命令来安装对应的组件及版本，并使用。
那么如何不在package.json写固定的版本号，而可以使用动态的方法进行组件的注册呢：
比如A用户觉得1.0版本的SDK足以满足他的日常需求，新版本的内容他不感兴趣会一直维持此版本的使用，而B用户觉得1.0版本的SDK不够用，他需要使用新版本的功能，那么此时A用户和B用户就需要使用两个不同的版本。
解决方案1、不同版本通过后端接口来获取，后端返回对应SDK的版本号及引入SDK需要的js、css文件地址。
2、前端页面加载对应的js， css， 并使用vue.component()来注册组件进行使用。
说明：当你直接引入index.js和index.css文件时，它们实际上包含了如下内容
index.js：包含了组件的JavaS ...
前言在折腾网站的时候，发现此版本主题是存在点小问题的。
比如首页导航，存在一点样式问题，如下：
导航分类过少时，存在和右侧不居中对齐问题
在github上也有pull request反馈了这个问题，并提交了代码，正常等作者合并下代码我们更新下版本即可，但作者可能由于其他事情，暂时没有处理。由于短期可能不会更新，加上自己有点强迫症看着不是很舒服，所以搞了一个临时的解决方案。
临时解决方案问题原因问题的主要原因是在源码中有这样一段css，为catalog-list设置 overflow-x: scroll，导致页面样式在没有滚动条的时候，也默认保留底部滚动条的高度，导致和右侧未对齐。
123456#catalog-list { /* 分类/标签较少时，可以选择不设置 width，居中显示 catalog-list-item */ display: flex; white-space: nowrap; overflow-x: scroll;}
解决办法修改此处css，将overflow-x: scroll 修改为 overflow-x: auto，即可解决此 ...
一、写在前面1. 不同博客类型的选择 目前搭建个人网站主要有两种选择：
动态网站：通常包括前端和后端两个部分，是通过数据库进行架构的网站，用户访问时网站会从数据库中提取信息并实时变更网站内容。这种网站通常利于维护、可交互性强，功能相对强大，但网站本身更加臃肿，用户访问时网页的打开速度也较慢。主流的动态博客框架有Wordpress、Typecho等。
静态网站：指全部通过html代码格式页面组成、所有内容都保存在html页面中的网站。可维护性较差，修改网页内容需要重新生存html页面，但访问速度极快、简洁、轻量。主流静态博客框架有Hexo、Hugo等。
部署方式也主要有两种选择：
托管至Github Pages上：借用Github的这一功能部署网站，操作简单、免费，但国内访问速度较慢，且无法被百度爬虫爬取收录。
部署至自己的云服务器上：需要花钱购买服务器、域名，但自主性强，可以随意折腾。在这里，我选择了Hexo+部署至腾讯云服务器的方式来完成我的博客网站的搭建，本文也会记录我从零开始搭建博客的过程。
2. Hexo简介 Hexo是一个基于Node.js的简洁、快速的轻量级 ...
前言首先，欢迎光临我的个人博客网站。
随着工作时间的增长，逐渐发现，自己需要一个地方来存储和分享（工作或日常相关的资料），于是，我有了这个博客网站。对我个人而言虽然有些晚，但也虽迟但到。
建站历程自己还是查询对比了较多的博客框架，最后选择了Hexo，嗨其实主要是相中了它的多种主题支撑，且浏览多个主题网站发现基本都支持魔改。谁会不喜欢好看一点的网站呢。
此网站设计风格是由张洪Heo基于butterfly主题进行设计的，并授权给安知鱼主题进行开源使用。在此非常感谢两位作者。其实选用安知鱼主题的关键原因在于它文档看起来更为规范舒服。不过在建站过程中发现安知鱼主题这个版本目前会存在部分小bug及部分功能暂不支持配置化，已经在github上提了部分Issues，等后续作者有时间维护或者合并了相应代码之后，本站也会同步更新，希望此主题会越来越好。
选定了对应的博客框架之后，就是进行网站的搭建了，以下是自己购买的部分配置，搭建过程网上有太多资料就不在此赘述了。
服务器： 腾讯云轻量应用服务器
图床：去不图床4G套餐及腾讯云OSS存储两套实现
CDN加速：暂时还未配置，在观望中
域名： 腾讯云选购并 ...
