rocket ui

？棄用

該圖書館已被棄用。這些組件已使用最新的Materi-UI和React版本重新設計，可以在此處找到：Rocket-UI

有關文檔和有意義的例子，請簽出GitBook文檔

---

火箭 - UI（已棄用）

位收集

一組可重複使用的可重複使用的反應組件構建在材料UI核心之上，用於開發快速友好的Web應用程序接口。

？ ‍檢查從位遺產到位和諧版本的遷移指南。

？安裝

NPMRC是NPM配置文件，為了使用我們的庫，您需要配置此文件。

！如果使用我們的WebApp Rocket Generator生成項目，則跳過此步驟。 .NPMRC文件已經配置

跑步

npm config set @totalsoft_oss:registry https://node.bit.cloud

此命令將在您的root .NPMRC文件中添加一個條目。如果不存在，它將創建一個。

- 安裝一個組件

轉到組件主頁，然後選擇您使用的軟件包管理器的命令。您也可以選擇要安裝的版本。

在您的終端中運行命令，您將準備使用它！

npm i @totalsoft_oss/rocket-ui.components.data-display.typography

- 使用單個軟件包安裝所有組件

如果您只想將項目中的所有組件放在一個軟件包中。導航到位雲中的核心組件。

通過運行安裝core包

npm i @totalsoft_oss/rocket-ui.core

用法

    import React from 'react'
    import Typography from '@totalsoft_oss/rocket-ui.components.data-display.typography'
    /* example using core package
    import { Typography } from '@totalsoft_oss/rocket-ui.core'
    */

    const App = ( ) => {
        return (
            < Typography variant = 'body2' emphasis = 'bold' >
                "Text"
            </ Typography >
        )
    } 

？組件結構

每個組件都在適合其目的的部分中。例如，所有與按鈕相關的組件都位於buttons文件夾中。所有組件都具有相同的文件結構。我們通過創建自己的組件生成器來實現和執行此結構，該功能由BIT提供。如您所見，所有組件和將使用rocket-generator模板創建的組件都將具有以下結構

• index.js條目文件。
• MyComponent.js主文件。
• MyComponent.test.js測試文件。
• MyComponent.docs.mdx docs文件。
• compositions組成文件夾。
  • MyComponent.composition.js組成，用於模擬不同狀態和上下文中的組件。

？貢獻指南

我們使用位用於組件管理和貢獻。 BIT是用於組成組件驅動軟件的開源工具。

- 安裝位

由於某些兼容性問題，建議使用命令提示而不是powershell。

npm i -g @teambit/bvm

bvm install

如果安裝時發生任何錯誤，請檢查故障排除部分。

- 啟動本地服務器

Bit成功安裝後，您可以將存儲庫克隆並充分使用位功能。

要立即開始運行命令提示bit start並打開Localhost：3000。您第一次運行此命令可能需要一段時間，因為它正在為您的開發環境構建整個用戶界面。當本地服務器啟動並運行時，您會看到所有組件，並且可以與它們進行交互。

bit start

- 修改現有組件

根據您的需求更改/修復組件後，您應該運行bit test以確保所有測試都通過，並在您的更改所需的情況下添加更多。

bit test

另外，如果添加了新功能，除了測試外，還應添加具有新功能的示例。示例文件位於compositions目錄中的每個組件目錄中。

更改組件後，您需要運行bit status以檢查與位相關的問題，然後bit compile以便在UI中進行最新修改。

bit status

bit compile

- 添加新組件

為了創建新組件，您應該使用我們自己的組件生成器rocket-generator ，它提供了一個有助於實現新組件的模板。

bit create rocket-generator components/buttons/my-component

- 打開拉請求

完成更改/功能/修復程序並要標記出發布哪些組件，其下一個版本和ChangElog Message使用-Soft選項。

bit tag -m " my message " --soft

運行上述命令後，您應該看到更改bitmap文件，然後可以創建拉動請求。

您可以閱讀有關他在這裡提供的BIT和其他功能性的更多信息。

執照

Rocket-UI已獲得MIT許可證的許可。 @totalsoft