Zhentiw - 博客园

2025年3月6日

摘要： ## 响应式断点 *Tailwind CSS* 默认提供了一组预设的断点，即屏幕尺寸范围，用于管理响应式样式。默认的断点包括： - *sm*: *640px* 及以上- *md*: *768px* 及以上- *lg*: *1024px* 及以上- *xl*: *1280px* 及以上- *2xl*: 阅读全文

posted @ 2025-03-06 15:03 Zhentiw 阅读(183) 评论(0) 推荐(0)

[CSS3] Tailwindcss组件

摘要：在前面的学习中，我们发现很多时候一些标签所应用的原子类是一样的。例如： <div class="float-left text-center flex items-center bg-blue-100 block"></div> <div class="float-left text-center 阅读全文

posted @ 2025-03-06 15:03 Zhentiw 阅读(45) 评论(0) 推荐(0)

[CSS3] TailwindCSS插件

摘要： TailwindCSS中是允许我们自定义插件和组件的。需要注意一下两者之间的区别，插件一般指的是实现某一个具体的功能，组件一般是指封装了一段公共的代码。自定义插件要创建一个自定义插件，非常的简单，只需要在 tailwindcss 的配置文件中配置 plugins 配置项，该配置项对应的是一个数组阅读全文

posted @ 2025-03-06 00:49 Zhentiw 阅读(158) 评论(0) 推荐(0)

[CSS3] Tailwindcss实战案例

摘要：自定义主题在开始本小节的实战之前，我们先来介绍一下 Tailwind CSS 中如何自定义主题。在 Tailwind CSS 中，虽然提供了大量预设样式，但有时您可能需要自定义样式以满足特定需求。Tailwind 提供了多种方法来自定义样式，包括扩展现有配置、添加新配置、编写自定义 CSS 和创阅读全文

posted @ 2025-03-06 00:48 Zhentiw 阅读(345) 评论(0) 推荐(0)

2025年3月4日

[Vue Pattern] Transparent Component Pattern

摘要： <template> <div> <input type="text" v-bind="$attrs" /> </div> </template> <script setup lang="ts" > // by default when you pass props to the component 阅读全文

posted @ 2025-03-04 15:30 Zhentiw 阅读(18) 评论(0) 推荐(0)

[Typescript] Singleton helper method

摘要： export function singleton< T extends new (...args: any[]) => object >(classCtor: T): T { let instance!: InstanceType<T> const proxy = new Proxy(classC 阅读全文

posted @ 2025-03-04 15:19 Zhentiw 阅读(21) 评论(0) 推荐(0)

[Zod] Create Custom Zod Schemas and Validate project-specific data

摘要： The example case covers room numbers validation: it must start with an uppercase letter followed by three digits. z.custom allows the creation of a br 阅读全文

posted @ 2025-03-04 14:46 Zhentiw 阅读(61) 评论(0) 推荐(0)

[Zod] Use Zod Schemas partially using shape and unwrap

摘要： Instead of creating many small schemas, which can complicate maintenance, Zod allows for the extraction of specific parts of a schema using the concep 阅读全文

posted @ 2025-03-04 14:42 Zhentiw 阅读(74) 评论(0) 推荐(0)

2025年3月3日

[Design Pattern] Vendor Wrapper Pattern

摘要： The Vendor Wrapper Pattern is about isolating a third-party (vendor) library behind your own abstraction. Instead of scattering vendor-specific API ca 阅读全文

posted @ 2025-03-03 15:33 Zhentiw 阅读(24) 评论(0) 推荐(0)

2025年3月2日

[Webpack] 打包优化二

摘要： optimization optimization这个配置项内部的很多优化策略都是在生产环境默认开启的，启用这些规则从一定程序上来讲可以显著减少 bundle 体积，优化代码生成，帮助长期缓存等。 optimization.minimize optimization.minimize指定 webpa 阅读全文

posted @ 2025-03-02 18:58 Zhentiw 阅读(139) 评论(0) 推荐(0)

Answer1215

公告