From eca63380969e16a2a67a6f8dddcc30874a68493d Mon Sep 17 00:00:00 2001 From: kuizuo Date: Mon, 2 May 2022 23:23:20 +0800 Subject: [PATCH] =?UTF-8?q?fix(blog):=20=E6=9B=B4=E6=96=B0=E5=8D=9A?= =?UTF-8?q?=E5=AE=A2=E5=86=85=E5=AE=B9=E3=80=8A=E4=BB=A3=E7=A0=81=E5=A4=87?= =?UTF-8?q?=E4=BB=BD=E3=80=8B?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- ...56\345\275\225\347\273\223\346\236\204.md" | 15 ++-- ...43\347\240\201\345\244\207\344\273\275.md" | 70 +++++++++++++++++ ...70\345\205\263\346\217\222\344\273\266.md" | 78 +++++++++++++++++++ ...60Tailwind CSS\344\275\277\347\224\250.md" | 6 ++ docusaurus.config.js | 2 +- 5 files changed, 160 insertions(+), 11 deletions(-) create mode 100644 "blog/reference/\344\273\243\347\240\201\345\244\207\344\273\275.md" diff --git "a/blog/java/SpringBoot\351\241\271\347\233\256\347\233\256\345\275\225\347\273\223\346\236\204.md" "b/blog/java/SpringBoot\351\241\271\347\233\256\347\233\256\345\275\225\347\273\223\346\236\204.md" index 9da4afe06..e052fd9e4 100644 --- "a/blog/java/SpringBoot\351\241\271\347\233\256\347\233\256\345\275\225\347\273\223\346\236\204.md" +++ "b/blog/java/SpringBoot\351\241\271\347\233\256\347\233\256\345\275\225\347\273\223\346\236\204.md" @@ -15,7 +15,7 @@ tags: [java, springboot, 开发] controller 目录下对应的也就是控制器，用于接收用户的请求（get，post 等），如下面代码 -```java +```java title="controller/UserController.java" @RestController @RequestMapping("/users") public class UserController { @@ -36,7 +36,7 @@ public class UserController { UserService 代码 -```java +```java title="service/UserService.java" public class UserService { @Autowired @@ -52,9 +52,7 @@ public class UserService { #### repository 类 -repository/UserRepository.java - -```java +```java title="repository/UserRepository.java" public interface UserRepository extends JpaRepository , JpaSpecificationExecutor { } @@ -62,9 +60,7 @@ public interface UserRepository extends JpaRepository , JpaSpecifica #### entity 类 -domain/User.java - -```java +```java title="domain/User.java" @Entity @NoArgsConstructor @Getter @@ -103,7 +99,7 @@ User.java 用于定义 user 实体，在 ORM 中，数据库表中的字段都 ```java public interface UserService { - List findAll()； + List findAll(); } ``` @@ -121,7 +117,6 @@ public class UserServiceImpl implements UserService { return userRepository.findAll(); } } - ``` 调用并无差异，与原本的 UserService 的区别就是加注解@Service 与 implements 实现，对 service 进行进一步的封装，调用只需要关注 service 接口层即可，相对更规范些。 diff --git "a/blog/reference/\344\273\243\347\240\201\345\244\207\344\273\275.md" "b/blog/reference/\344\273\243\347\240\201\345\244\207\344\273\275.md" new file mode 100644 index 000000000..0fd697a79 --- /dev/null +++ "b/blog/reference/\344\273\243\347\240\201\345\244\207\344\273\275.md" @@ -0,0 +1,70 @@ +--- +title: 代码备份 +date: 2022-05-02 +authors: kuizuo +tags: [随笔] +--- + +前段时间因为笔记本不在身边，导致一些本地磁盘代码数据没法直接同步过来。于是就准备把这些年写的代码重新整理一下，谈谈常用备份手段以及我的[最佳手段](#最佳实现) + + + +## 备份手段 + +### 本地硬盘 + +大多数代码的存储方式，方便存取，我通常会新建一个驱动器 **代码 (F:)** 来将所有代码放在此处，可能还会自备一个移动硬盘来存储代码。 + +#### 优点 + +无需网络，保存时间久，**读写数据快**。 + +#### 缺点 + +数据同步不方便，难以做到跨端跨设备共享。万一硬盘出了点问题，代码将难以恢复。 + +### 网盘 + +例如某度网盘，Onedrive等等，这类备份通常有一定的限制，例如下载限速严重，空间限制，保存期限等等，具体以实际使用网盘为例。 + +在某度网盘中，选择你的想备份的文件夹，是可以做到文件夹自动备份，但对于你项目中的依赖文件（例如Node的node_module）那不小的空间也将备份，但有文件夹数量以及大小限制，如下图，这里只是简单一提，不作为备用手段。 + +![image-20220502153823417](https://img.kuizuo.cn/image-20220502153823417.png) + +#### 优点 + +相比本地硬盘而已，**网盘更易分享**，在其他设备中只需要登录网盘账号或访问网盘所分享的链接。 + +#### 缺点 + +有些免费的网盘，必然有一定的限制，例如空间限制，下载限制，远不如本地硬盘。如果不付费的话，体验效果堪忧。 + +### 代码托管平台 + +代码托管平台有很多，例如Github、Gitee等等，甚至可以自建一个像GItLab的代码托管平台。 + +#### 优点 + +**代码实时性强**，并且基于Git版本管理工具可以很方便查看代码的历史操作，对于项目类的而言非常方便。 + +#### 缺点 + +对于一些公有项目而言，一些私密信息（密码）不易于上传，在其他设备拉取代码就不存在这部分数据。同时**对于大量代码就束手无策**。 + +## 最佳实现 + +介绍完上面的几种代码备份手段，各自都有优缺点，至于如何选择就因人而异，这里就说说我是如何备份代码的。 + +### 全部代码 + +对于全部代码而言，肯定是多备份远优于不备份的。所以我通常会在本地电脑硬盘中备份两份代码，一份就正常放在固态硬盘上，另一份则放在机械硬盘，同时再备份一份代码在网盘上。 + +但机械硬盘与网盘的备份时间一致，都是定期或阶段性的备份（甚至可能会忘记备份），所以这种对代码的实时性要求不高，通常这类代码为学习代码以及工具类相关代码。 + +### 项目代码 + +对于项目代码而言，我是毫不犹豫的选择代码托管平台，主要使用到版本管理工具Git，可以很好的查看代码的全部历史记录以及修改追踪能力。易于维护的同时，代码分享与同步也比网盘来的高效。设置好.gitignore也不会将非必要的文件（依赖文件，打包后的文件，生产环境下的配置文件）上传上去。 + +## 最后 + +**永远不要闲备份麻烦，当你辛辛苦苦写的代码丢失时，那才是真正的麻烦。** diff --git "a/blog/vue/vite\347\233\270\345\205\263\346\217\222\344\273\266.md" "b/blog/vue/vite\347\233\270\345\205\263\346\217\222\344\273\266.md" index 8a9943cb4..cf9023d9c 100644 --- "a/blog/vue/vite\347\233\270\345\205\263\346\217\222\344\273\266.md" +++ "b/blog/vue/vite\347\233\270\345\205\263\346\217\222\344\273\266.md" @@ -204,6 +204,84 @@ export default defineConfig({ }) ``` +## [unplugin-vue-define-options/vite](https://github.com/sxzz/unplugin-vue-define-options) + +**script setup语法糖通过defineOptions定义组件name、inheritAttrs、props、emits** + +安装 + +```sh +npm i unplugin-vue-define-options +``` + +```javascript title="vite.config.js" +import { defineConfig } from 'vite' +import DefineOptions from 'unplugin-vue-define-options/vite' +import vue from '@vitejs/plugin-vue' + +export default defineConfig({ + plugins: [vue(), DefineOptions()], +}) +``` + +在`tsconfig.json`设置types，如下所示: + +```json +{ + "compilerOptions": { + "types": ["unplugin-vue-define-options"] + } +} +``` + +不然在ts项目中会提示 **找不到名称“defineOptions”**，具体使用如下 + +```vue + +``` + +输出 + +```vue + + + +``` + +如果只是想**单纯的设置组件名**的话，这个插件 [vite-plugin-vue-setup-extend](https://github.com/vbenjs/vite-plugin-vue-setup-extend) 可能更适合，只需要在script中添加一个name属性即可。 + +```vue + + + +``` + ## [vite-plugin-mock](https://github.com/vbenjs/vite-plugin-mock) **提供本地和生产模拟服务。** diff --git "a/docs/skill/css/\350\256\260Tailwind CSS\344\275\277\347\224\250.md" "b/docs/skill/css/\350\256\260Tailwind CSS\344\275\277\347\224\250.md" index 46ce31759..4854b6985 100644 --- "a/docs/skill/css/\350\256\260Tailwind CSS\344\275\277\347\224\250.md" +++ "b/docs/skill/css/\350\256\260Tailwind CSS\344\275\277\347\224\250.md" @@ -67,6 +67,12 @@ bg-${variableName} background-color: var(variableName); ``` +:::info + +补充: 在Tailwind CSS 3.0中，支持`bg-[#bada55]`或`h-[24px]`的形式，即自定义样式，方括号内为具体变量值。 + +::: + ### 属性化模式 对于一长串的class字符串，在维护的时候寻找其中的原子类特别不方便，使用属性化模式就可以写成下面这种形式 diff --git a/docusaurus.config.js b/docusaurus.config.js index c896b130c..922475c68 100644 --- a/docusaurus.config.js +++ b/docusaurus.config.js @@ -21,7 +21,7 @@ const config = { image: 'img/kuizuo.jpg', announcementBar: { id: 'announcementBar-2', // Any value that will identify this message. - content: `代码能重写，人不能重来`, + content: `今天不学习,明天变垃圾`, }, metadata: [ {