宣布 Bit 适用于 Vue 公测版

团队协作构建、共享和开发 Vue 组件。

特别感谢Evan You的帮助，以及 Vue 社区所有美好的事物 🙏

今天，我们非常高兴地宣布 Vue.js 组件的 Bit 支持正式发布 Beta 版！🎉

组件是一种将应用程序用户界面拆分成类似乐高积木的小模块的绝佳方式。与React和Angular类似，Vue 组件与Bit完美结合， Bit可以帮助您跨项目构建和协作处理组件，从而加快开发速度并规范开发流程。

个人开发者或小型团队可以使用 Bit 在不同的 Vue 应用程序之间共享组件，同时同步它们之间的更改。

大型组织可以利用 Bit 来发展其组件经济，并帮助组件构建者和应用程序开发人员协同工作。更紧密的协作意味着更高的组件采用率，从而加快开发速度，并为用户带来更流畅、更一致的 UI/UX 体验。

欢迎深入了解更多信息，亲身体验 Bit 与 Vue的结合，或联系团队咨询任何问题或寻求帮助。祝您合作愉快 :)

轻松在应用程序之间共享 Vue 组件

Bit可以轻松地在不同的项目和应用之间隔离和共享 Vue 组件，同时保持更改同步。无需重构、配置或额外开销。

要开始实际操作 Bit 和 Vue，最好的方法是尝试官方的 Bit for Vue 教程。该教程会指导您如何将一个项目中的组件无缝隔离，并快速将其用于另一个项目中。您还可以查看Bit for Vue 指南，确保遵循最佳实践。

完成后，您还将获得一个bit.dev组件集合，您可以在其中组织、重用组件并与团队共享。快来试试吧！

它是如何运作的？

• 使用 Bit，您可以跟踪代码仓库中的不同组件，并让 Bit 将它们及其所有相关依赖项隔离开来。每个组件都成为一个独立的单元，可以独立构建、发布、更新和使用。

• 使用新的Vue 编译器，您无需定义任何组件构建配置；只需将编译器安装到项目的工作区中，即可观察每个组件如何作为可重用的单元独立构建。

• 然后，只需对组件进行版本控制并发布即可。现在，每个组件都可以在任何其他项目和应用程序中单独使用。

• 由于 Bit 控制着每个组件在存储库中的依赖关系图，因此您可以轻松地更新单个组件以及受此更改影响的所有其他组件，而不会影响其他任何组件。

• 除了使用 npm/yarn 安装组件外，您还可以使用 Bit 直接从使用组件的项目/仓库导入和修改组件的源代码，并在项目之间更新更改。

从实际代码构建您的组件设计系统

借助 bit.dev 平台，您的团队可以将组件组织成一个由实际组件构成的设计系统，让所有成员（包括开发人员、设计师和其他人员）都能共享和协作。以下是 Vuesax 库在 bit.dev 中组件化的示例。

通过这种基于真实代码的设计系统，你的组件不再仅仅是GitHub上的图片+组件库，而是一个鲜活的可视化组件系统，能够反映你设计的实际实现。

以下是一个例子（vuesax，由 lusaxweb 提供）

构建蓬勃发展的共享组件经济

通过使用 Bit，组件构建者可以构建、分发其共享组件，并在整个组织内实现更广泛的应用。在构建组件库时，Bit 允许您隔离组件，使其独立于“所属库”进行构建和测试。

修改组件时，Bit 可以让您轻松发现依赖组件，并允许您使用单个命令同时更新它们。每个组件都可以单独进行版本控制，并作为独立单元发布，以便其他人可以在他们的应用程序中查找和使用它。

通过 bit.dev，组织中的每位开发人员都可以协作使用、修改和建议更新他们自己项目中的组件，而无需任何上下文切换。

探索您的组件，以及来自社区的更多内容

bit.dev 上分享的 Vue 加载指示器组件集合

新增的“Vue”标签让您可以搜索和筛选要在应用程序中使用的 Vue 组件。您可以随意探索社区分享的 Vue 组件，也可以为您的团队添加自己的组件。

您可以按组件包大小和依赖项筛选组件，浏览基于组件示例的可视化快照，然后选择所需的代码。准备就绪后，您可以将组件安装到项目中，或者使用 Bit 将组件导入到项目中进行进一步开发……一切由您决定。

沙箱化你的 Vue 组件示例

在 bit.dev 上整理 Vue 组件，每个组件的示例都会在可实时编辑的沙箱中渲染和可视化。您可以在实时 Vue 沙箱 Playground 中运行每个组件，体验示例并了解其工作原理。开发人员、设计师、产品经理以及所有其他人员现在都可以一起体验，轻松了解您的组件是如何工作的！

使用 Vue 和 Bit 进行开发

以下是一些使用 Bit 和 Vue 的小技巧。如果您有任何反馈，请在 GitHub 上提交 issue或联系团队寻求支持，帮助我们改进用户体验。感谢您的帮助！

• 要构建 Vue 组件，您应该使用官方的 Vue 组件编译器。Vue 编译器（https://bit.dev/bit/envs/bundlers/vue）允许您使用各种 Vue 配置——babel 或 typescript 以及您需要的任何 CSS 预处理器。

只需将编译器安装到项目的工作区中，让它独立构建每个组件即可。无需任何构建配置。

• 您可以使用 bit.dev 中的 Vue Playground 创建 Vue 组件示例。只需从 Playground 选项中选择 Vue，然后根据需要修改代码即可。保存示例，以便其他人可以查看。

• 除了使用 npm/yarn 安装组件之外，Bit 还允许你将托管组件的源代码“导入”（“克隆”）到任何项目中。使用导入的组件有一些需要注意的特殊事项。这些事项在我们的Vue 指南文档中有详细说明。

接下来……

虽然 Bit for Vue 的 Beta 版现已正式发布，但我们仍有一些需要改进的地方。其中之一是 Bit 的测试工具，包括 Jest。您可以利用 Bit 将代码仓库中的组件隔离，并使用测试工具在完全独立于代码仓库的情况下查看其测试是否通过。所有操作均无需任何代码更改。

然而，Jest 测试工具目前性能还不够理想。我们正在努力修复和改进它，使 Bit 成为一个强大的工具，用于在独立组件与其父项目隔离的情况下进行测试。

近期路线图的核心在于帮助团队将 Bit 用作组件设计系统，该系统专为开发者打造，并由真实代码构成。为了提升用户体验，我们将引入与 GitHub 的深度集成（从库中发布组件、将其导入另一个项目、进行修改，并将更新作为 PR 提交给库——所有操作均无需切换上下文！），并支持其他工具，包括组件故事文件，从而通过 bit.dev 整合所有组件协作和发现。

与此同时，欢迎试用 Bit for Vue，如有任何疑问，请随时联系我们。❤️ Bit 团队敬上