Скачать rocket ui - скачать исходный код rocket ui

rocket ui

Сторонние компоненты

v2.0.17

Скачать

? Устарел

Эта библиотека устарела. Компоненты были перенесены с использованием последних версий Materi-UI и React и их можно найти здесь: Rocket-UI

Для документации и значимых примеров. Отстаивание документации GitBook

Ракета-UI (устаревший)

Бит Коллекция

Набор многоразовых и композиционных компонентов React, созданных на вершине материала пользовательского интерфейса для разработки быстрых и дружественных интерфейсов веб -приложений.

?

? Установка

NPMRC - это файл конфигурации NPM, и для использования нашей библиотеки необходимо настроить этот файл.

‼ Пропустите этот шаг, если проект генерируется с помощью нашего генератора Rocket WebApp. Файл .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 . Все компоненты имеют одинаковую структуру файлов. Мы реализуем и обеспечиваем эту структуру, создавая наш собственный генератор компонентов, функциональность, предоставленную кусочком. Как вы увидите, все компоненты и те, которые будут созданы с использованием шаблона 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 start и откройте Localhost: 3000. Может потребоваться некоторое время, чтобы построить в первый раз, когда вы запускаете эту команду, поскольку она создает весь пользовательский интерфейс для вашей среды разработки. Когда локальный сервер работает и запускается, вы увидите все компоненты, и вы можете взаимодействовать с ними.

bit start

- Изменить существующие компоненты

После изменения/исправления компонента в соответствии с вашими потребностями, вы должны запустить bit test чтобы убедиться, что все тесты проходят, и добавить больше, если ваши изменения требуют.

bit test

Кроме того, если добавлена новая функция, в дополнение к тестам, также должен быть добавлен пример с новой функциональностью. Файлы примеров находятся в каждом каталоге компонентов внутри каталога compositions .

После изменения компонента вам необходимо запустить bit status , чтобы проверить проблемы, связанные с битами, а затем bit compile , чтобы иметь последние изменения в вашем пользовательском интерфейсе.

bit status

bit compile

- Добавление нового компонента

Для создания нового компонента вы должны использовать наш собственный генератор компонентов rocket-generator , который обеспечивает шаблон, который помогает в реализации нового компонента.

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

- Открыть запрос на вытягивание

Когда ваше изменение/функция/исправление будет сделано, и вы хотите отметить, какие компоненты опубликованы, их следующая версия и использование сообщений ChangeLog -Soft Option.