15 个有趣的 JS 和 CSS 库

时光飞逝， 每月 Tutorialzine 都会为大家分享一些有趣的前端库。在本月，他们又准备了哪些优秀的 Web 开发资源呢？前端儿，一起来瞧瞧吧！

1. Buefy
   --

这是一个基于 Bulma 的 Vue.js 轻量级 UI 组件，而 Bulma 则是基于 Flexbox 的 CSS 库。Buefy 具备典型的 Web 应用程序所必备的所有组件，例如 modals、toast 以及 notifications 等动态元素，使开发人员可以快速添加任何用户界面到其现有的 Vue.js 项目。

项目地址：【传送门】

2. HR.js
   --

HR.js 是一个用于高亮并替换 DOM 中文本的零依赖库。它的 API 简直不能再简单了。你只需要使用 CSS 选择器来定位保存所需文本的 HTML 父元素，选择好要高亮的单词，并设置背景颜色，就可以搞定了。

项目地址：【传送门】

3. React VR
   --

React VR 是用于创建在 Web 浏览器中运行 VR 应用程序的框架。它将现代的 API（如 WebGL 和 WebVR）与 React 的声明式渲染进行搭配，从而产生可以通过各种设备使用的体验。

项目地址：【传送门】

4. Tippy.js
   --

这是一个用于动画工具提示的纯 JavaScript 库。Tippy.js 提供了丰富的悬停效果以及超过 20 个自定义选项。它也是超轻量级的库，并具备相当不错的浏览器兼容性。但如果出现个别浏览器不支持的情况，它会自动退回至常规的 title 属性。

项目地址：【传送门】

5. Barba.js
   --

Barba.js 是一个无依赖的 JavaScript 库，可用于在单页应用程序的视图间创建平滑的过渡效果。该库的逻辑是围绕 PJAX（推送状态 AJAX）来设计的，绕过正常有效的 URL，并通过 XMLHttpRequest 来加载新页面。Barba 还能确保通过 Push 状态的 API ，在应用程序的 URL 中可以正确的反映出状态的变化。

项目地址：【传送门】

6. UIkit
   --

UIkit 是一个优秀的轻量级前端框架，它包含了相应的 SVG 图标字体以及丰富的组件。无论是外观，还是框架，UIkit 的设计都十分的出彩。它不光具备统一的样式，还有易于记忆的 API，许多自定义选项以及有用的修饰器类，并且它的使用文档编写的也相当的出众。

项目地址：【传送门】

7. Haul
   --

Haul 是一个用于开发 React Native 应用程序的命令行工具。它可以直接替代 React Native packager，提供比 Webpack 更好的支持，并能够改进错误消息，大大减少编译时间。Haul 也拥有出色的使用文档，并且完全开源、可定制。

项目地址：【传送门】

8. AcrossTabs
   --

AcrossTabs 是一个用于跨浏览器 Tabs 间进行通信的 JavaScript 库，你可以使用它在不同的浏览器 Tabs 上打开或关闭网页。由于父 Tab 可以访问子 Tab 上有用的信息（例如 UID），所以它可以判断子 Tab 是否依旧打开，或者已关闭。

项目地址：【传送门】

9. Stylelint
   --

Stylelint 是一款现代的 CSS linter 工具，它可以帮助团队在样式表中执行固定的 CSS 标准。该库非常强大，它不仅可以让你禁止或设置白名单属性，还能够捕获错误以及识别 SCSS 语法。同时，Stylelint 也可完全定制，帮助你添加或去除一些规则选项。

项目地址：【传送门】

10. Iconate
    --

这是一个非常棒的 Vanilla JavaScript 库。通过点击图标，它能够帮你完成带有丰富平滑动画效果的图标转换。你也可以将 Iconate 与所有的 CSS 图标字体一同使用。即你只需在 HTML 中添加一个图标，并使用简单的 JavaScript API 来选择要将其转换为哪一种图标，同时选择相应的动画效果就搞定了。

项目地址：【传送门】

11. React-Datasheet
    --

React-Datasheet 是一个用于向应用程序添加类似 Excel 数据表的 React 组件。你可以对单元格进行自由编辑、分组选择、复制、粘贴、删除等操作。另外，在 GitHub 上还有三个有用的示例，供你参考。即基本的表，带有公式的表以及嵌套组件的表。

项目地址：【传送门】

12. Pure CSS
    --

这是一个轻量级、响应式的纯 CSS 模块框架。整个库在 gzip 压缩后，仅有 3.8 kb 的大小，如果你仅使用其中的一部分模块，那 CSS 真是小到没有朋友了！同时，它模块包括了基本样式集、响应格网、表单组件、按钮、表格和菜单，适用于任何的 Web 项目。

项目地址：【传送门】

13. Simple Icons
    --

Simple Icons 是一个涉及知名品牌（涵盖社交网络、应用程序、服务等）的免费图标合集。这些图标都是用 SVG 制作的，所以它们可以被缩放到任何尺寸，不用担心图片的像素。而大多数图标的大小都低于 500 字节。

项目地址：【传送门】

14. Chroma.js
    --

Chroma.js 是一个用于处理颜色的微型 JavaScript 库。它提供了丰富的 API，以及超过 50 种用于操纵颜色的功能，让你可以使用色彩模式切换，改变亮度和饱和度，创建渐变比例等许多实用的色阶处理方法。

项目地址：【传送门】

15. Weex
    --

Weex 是一个构建跨平台的移动应用程序框架，类似于 React Native，但适用于 Vue.js. 你可以利用 HTML、CSS 和 JavaScript 编写应用程序，并将其以 Android 和 iOS 客户端的形式呈现。该框架有许多内置的组件、API 和其他有用的功能。

项目地址：【传送门】

感谢你的阅读。若你有所收获，欢迎点赞与分享。

注：

1. 本文版权归原作者所有，仅用于学习与交流；
2. 如需转载译文，烦请按下方注明出处信息，谢谢！

英文原文：15 Interesting JavaScript and CSS Libraries for May 2017
作者：Danny Markov
译者：IT程序狮
译文地址：http://www.jianshu.com/p/99b66b214bbd