Скачать Lightning UI Components - Lightning UI Components Скачать исходный код

Lightning UI Components

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

v2.25.1

Скачать

Молния UI

Эта библиотека содержит общие компоненты Lightning, вы можете просмотреть нашу документацию по журналу рассказов, чтобы узнать больше о каждом компоненте и о том, как их использовать в вашем приложении.

Чтобы облегчить процесс разработки для нашей тематической архитектуры, мы преобразовали этот проект в монорепо с использованием рабочих пространств пряжи. Это позволяет инженерам работать в нескольких пакетах без необходимости npm link или yarn link . Это также имеет некоторые другие преимущества, включая легкую видимость в разных пакетах @LightningJS/UI, стандартизации и лучшем управлении выпуском.

В настоящее время сохраняются три пакета и выпущены из этого проекта.

@lightningjs/ui-компоненты
@lightningjs/ui-components-test-utils
@lightningjs/ui-components-theme-base

Местное развитие

Чтобы запустить хранилище локально, запустите:

 yarn install
yarn start

Это запустит сборник рассказов по адресу http: // localhost: 8000/.

Зависимости от сверстников

@lightningjs/ui-components имеет зависимость от сверстников от @lightningjs/core^2.x . Если вы застряли, используя старую молнию , то есть wpe-lightning^1.x , вам нужно будет псевдоним @lightningjs/core в процессе сборки. Если вы объединяете свое приложение с помощью WebPack, вы должны добавить это в свою конфигурацию:

 // in webpack.config.js
module . exports = {
  resolve : {
    alias : {
      '@lightningjs/core' : path . resolve ( __dirname , 'node_modules/wpe-lightning' )
    }
  }
} ;

Примечание: псевдоним @lightningjs/core , чтобы указать на wpe-lightning не гарантированно будет работать со всем! Рассмотрите возможность обновить свою библиотеку Lightning как можно скорее.

Установка

Установите из NPM:

npm install --save @lightningjs/ui-components

@lightningjs/ui-components имеют зависимость от сверстников от пакета Lightning

npm install -S @lightningjs/ui @lightningjs/core

Использование

Вы должны импортировать компоненты, используя ES6, названный импорт, например, так:

 // App.js
import lng from '@lightningjs/core' ;
import { Button } from '@lightningjs/ui-components' ;

Вы не должны использовать импорт пути, как это:

 // Do not use
import Button from '@lightningjs/ui-components/components/Button' ;

Поскольку пакеты теперь объединены с подкором, это обеспечивает правильное поведение деревьев. Для получения дополнительной информации о встряхивании деревьев в документации @material/ui имеет отличное руководство по размеру комплекта разработки ( примечание : это внешняя документация, иначе не связанная с этим проектом!).

Используйте компоненты в своем приложении

 import { FocusManager } from '@lightningjs/ui-components' ;

class MyComponent extends lng . Component {
  static _template ( ) {
    return {
      FocusManager : {
        type : FocusManager ,
        direction : 'row' ,
        children : [ ]
      }
    } ;
  }
  _getFocused ( ) {
    return this . tag ( 'FocusManager' ) ;
  }
}