前言：在 Vite 项目中使用 npm run build 直接打包，打包后所有的静态文件都在 assets 文件中，js、css、图片等都放在一起看着很不舒服。我们可以通过配置 vite.config.js 来进行分包处理。打包机制底层是使用的 roolup，可以参考。vite.config.js 分包配置如下，备注写明字段用途，其中。是 rollup 中的展位符。

大文件上传可能会有浏览器限制，网络稳定等问题影响用户体验，可以通过切片上传解决。

前言：浏览器上实现 mac docker 效果，实现思路，1. 布局，方框间距用元素代替，因为有放大缩小功能，不用元素的话，不好控制。2. 定义个 css 变量 i，用来代表放大比例。3. 确定每个元素的 i 值，根据鼠标移动，动态生成一个曲线。

<li>选项1</li><li>选项2</li><li>选项3</li>

如今我们布局大多时候都是用的 flex 布局，但是有时我们也可以使用 margin 小技巧去完成布局。在弹性盒中当我们把 margin 某一个方向上设置为 auto，他的含义是用 margin 吃掉这个方向的剩余空间。

keep-alive` 是 Vue.js 提供的一个内置组件，用于缓存动态组件。当一个组件被包裹在`keep-alive`组件内部时，在组件切换过程中，该组件的状态（如组件中的数据、DOM 状态等）会被保留，而不是像普通组件那样被销毁和重新创建。这对于提高应用性能和用户体验非常有用，特别是在频繁切换组件的场景下。

前言：无论什么样式的轮播图，核心 JS 实现原理都差不多。所以小伙伴们，还是需要了解一下核心 JS 实验原理的。

【代码】前端 CSS 经典：grid 栅格布局。

一文深入了解递归逻辑

前言：简单实现水波进度样式，简单好看。