牧羊人_

Nuxt3 支持服务端渲染给用户带来了更好的首屏体验，但是给只熟悉单页应用开发的前端同学也带来了一定的学习成本。怎么写一个不会闪屏的主题色切换呢？

回顾上文，我们已全方位洞悉搭建 Vue 组件库所需的技术选型，也透彻明晰后续搭建步骤的整体规划。此刻，我们即将正式踏入实战的首站 —— 环境搭建，让我们一同深入探索，解锁其中蕴藏的奥秘。

我们已经领略了 BEM 规范在 CSS 样式管理方面的强大功能，它为我们的样式代码带来了秩序与高效。但在前端开发中，JavaScript 作为交互逻辑的核心语言，与 CSS 紧密协作，该如何实现呢？

上一篇文章中，我们一步一个脚印，扎实地完成了 Vue 组件库搭建的环境搭建工作。当我们把目光聚焦到组件库的样式设计时， BEM规范，自然而然地进入了我们的视野，让我们一同深入探寻 BEM 规范的奥秘。

打工人混迹职场这么久，图片处理肯定都没少碰。不过咱大部分时候都是直接 “抄近道”，用现成的三方组件😏。主打一个会用工具，毕竟善用工具可是咱人类的 “超能力”。但总有些UI不愿意让你如意，只能自己实现

在上一篇，我们已经成功把图片按 path 绘制到 Canvas 上，也搞定了裁剪区域，这可是完成了相当关键的部分。接下来，就要实现移动图片、缩放图片以及保存图片这些功能了。

在搭建组件库时，我们已用 SASS 实现 BEM 规范，为样式管理筑牢根基🏗️。但 SASS 远不止于此，其丰富通用方法和灵活变量机制，将为组件库样式雕琢带来质的飞跃。

咱们已经实现了 SASS 中一系列实用的函数和混入，这篇文章将带你深入了解怎样利用这些工具实现 SASS 全局变量的巧妙定义、灵活运用，进而让整个组件库的样式焕发出更加协调统一的光彩🌟

在组件库的构建中，那些简洁美观、表意清晰的图标组件🎨，宛如灵动的视觉音符🎶，为用户体验增添了独特魅力。让我们一同开启组件库首个组件 —— 图标组件的开发之旅，一探究竟🔍。