使用 CSS BEM 规范对样式进行命名

Hello，大家好。这里是妙才的周刊第 35 期，这里将会分享笔者每周接触到的科技内容亦或是 Web 开发的一些新知识，甚至是一些有趣的非技术性人、事、物 🚀

封面图：象象的猫咪在巡视领地

以下是本周话题：

Vue-Toastification：支持vue2 和 vue3的通知组件，扩展性很好，非常适合作为vue项目独立的消息通知组件。

以下是一些截图：

这个组件的动画效果还挺不错的，如果需要自定义一些样式也可以通过添加覆盖样式来满足需求。

here are only two hard problems in Computer Science: cache invalidation and naming things — Phil Karlton

BEM — Naming：BEM 方法确保参与网站开发的每个人都使用单一代码库并使用相同的语言。使用正确的命名将使您为网站设计的变化做好准备。

如果你需要开发团队组件库，亦或是开源组件库，在编写样式表的时候遵守良好的命名规范有利于后续的维护和提高代码的可读性。最重要的是，你将不必为给样式起名而烦恼。

如果你想看中文分享内容，可以看看这里CSS — BEM 命名规范 - 掘金。

Valtio是日本开发者dai-shi开发的又一React状态管理库，Valtio 使代理状态对 React 和 Vanilla 变得简单，笔者将会主力使用此库来处理状态数据操作。

huntersofbook the door from books to software · huntersofbook：是专门为完善vue生态而建立的社区。作者声称自己的团队将永远把这种贡献回馈给世界。

主要分享：vue3、Nuxt3、Vite4、TypeScript、Npm Packages等技术相关的最佳实践。

Vue3-carousel | Vue3-carousel是一个基于Vue3的轮播图组件库，代码示例很丰富，我们可以很方便地将之作为项目的轮播图解决方案。

文档内也详细地说明了对外暴露的一些接口和相关特性，入手难度很低。

Flowbite - Build websites even faster with components on top of Tailwind CSS：基于tailwindcss的UI组件库，样式调教得非常赏心悦目。如果你的项目用上了tailwindcss，那么就可以很方便地接入这个UI库。

此外，这个库更新非常频繁，目前已经有了超过 600+ 的组件分享，扩展性也很棒。

内容很完整，可以作为自己的库的经验参考。

这是一款MacOS的音乐调节软件，开源免费。

使用这个应用可以方便地单独调整系统每一个应用的音量🔊：

如果你也使用brew来管理应用，那么可以很方便地安装这个应用：

brew install --cask background-music

好了，今天的分享就先到这里，大家下周见~

Friends