konsolpro-custom-ui 0.0.327 → 0.0.329
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +1 -146
- package/package.json +1 -1
package/README.md
CHANGED
|
@@ -1,146 +1 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
Для корректной работы IDE (vscode/cursor) необходимо добавить следующие параметры.
|
|
4
|
-
```json
|
|
5
|
-
// .vscode/settings.json
|
|
6
|
-
{
|
|
7
|
-
// Disable the default formatter, use eslint instead
|
|
8
|
-
"prettier.enable": false,
|
|
9
|
-
"editor.formatOnSave": false,
|
|
10
|
-
|
|
11
|
-
"cSpell.language": "en,ru",
|
|
12
|
-
|
|
13
|
-
// Auto fix
|
|
14
|
-
"editor.codeActionsOnSave": {
|
|
15
|
-
"source.fixAll.eslint": "explicit",
|
|
16
|
-
"source.organizeImports": "never"
|
|
17
|
-
},
|
|
18
|
-
|
|
19
|
-
// Silent the stylistic rules in you IDE, but still auto fix them
|
|
20
|
-
"eslint.rules.customizations": [
|
|
21
|
-
{ "rule": "style/*", "severity": "off", "fixable": true },
|
|
22
|
-
{ "rule": "format/*", "severity": "off", "fixable": true },
|
|
23
|
-
{ "rule": "*-indent", "severity": "off", "fixable": true },
|
|
24
|
-
{ "rule": "*-spacing", "severity": "off", "fixable": true },
|
|
25
|
-
{ "rule": "*-spaces", "severity": "off", "fixable": true },
|
|
26
|
-
{ "rule": "*-order", "severity": "off", "fixable": true },
|
|
27
|
-
{ "rule": "*-dangle", "severity": "off", "fixable": true },
|
|
28
|
-
{ "rule": "*-newline", "severity": "off", "fixable": true },
|
|
29
|
-
{ "rule": "*quotes", "severity": "off", "fixable": true },
|
|
30
|
-
{ "rule": "*semi", "severity": "off", "fixable": true }
|
|
31
|
-
],
|
|
32
|
-
|
|
33
|
-
// Enable eslint for all supported languages
|
|
34
|
-
"eslint.validate": [
|
|
35
|
-
"javascript",
|
|
36
|
-
"javascriptreact",
|
|
37
|
-
"typescript",
|
|
38
|
-
"typescriptreact",
|
|
39
|
-
"vue",
|
|
40
|
-
"html",
|
|
41
|
-
"markdown",
|
|
42
|
-
"json",
|
|
43
|
-
"jsonc",
|
|
44
|
-
"yaml",
|
|
45
|
-
"toml",
|
|
46
|
-
"xml",
|
|
47
|
-
"gql",
|
|
48
|
-
"graphql",
|
|
49
|
-
"astro",
|
|
50
|
-
"svelte",
|
|
51
|
-
"css",
|
|
52
|
-
"less",
|
|
53
|
-
"scss",
|
|
54
|
-
"pcss",
|
|
55
|
-
"postcss"
|
|
56
|
-
]
|
|
57
|
-
}
|
|
58
|
-
```
|
|
59
|
-
|
|
60
|
-
# Документация по разработке и CI/CD
|
|
61
|
-
up
|
|
62
|
-
## Запуск проекта для локальной разработки
|
|
63
|
-
|
|
64
|
-
@TODO: Тут описать что нужно сделать чтобы локально проект завелся и можно было добавлять новые компоненты и видеть их.
|
|
65
|
-
|
|
66
|
-
## Запуск проекта для локальной разработки с использованием интеграции в существующий проект
|
|
67
|
-
|
|
68
|
-
Для того чтобы видеть компоненты custom-ui прямо в интерфейсе основного проекта konsol, используйте `yarn link`. Это позволит вам вносить изменения в компоненты и сразу видеть их в konsol.
|
|
69
|
-
|
|
70
|
-
### Шаги:
|
|
71
|
-
|
|
72
|
-
1. Запустите сборку custom-ui в watch-режиме, чтобы при изменениях происходила автоматическая пересборка:
|
|
73
|
-
```bash
|
|
74
|
-
yarn run build:watch
|
|
75
|
-
```
|
|
76
|
-
|
|
77
|
-
2. Перейдите в директорию основного проекта konsol и подключите линкованную библиотеку:
|
|
78
|
-
```bash
|
|
79
|
-
yarn link ../custom-ui # или ваша директория custom-ui проекта
|
|
80
|
-
```
|
|
81
|
-
|
|
82
|
-
3. Установите зависимости konsol, если ещё не сделано:
|
|
83
|
-
```bash
|
|
84
|
-
yarn
|
|
85
|
-
```
|
|
86
|
-
|
|
87
|
-
4. Важно чтобы в `.env` файле присутствовал:
|
|
88
|
-
```
|
|
89
|
-
REACT_APP_LOCAL_UI_KIT=true # Добавляет Alias`s в webpack и гарантирует, что используется react и react-dom из основного проекта, а не из подключённой библиотеки для избежания дублирования зависимостей.
|
|
90
|
-
```
|
|
91
|
-
|
|
92
|
-
5. Запустите основной проект:
|
|
93
|
-
```bash
|
|
94
|
-
yarn start
|
|
95
|
-
```
|
|
96
|
-
|
|
97
|
-
Теперь все компоненты из custom-ui доступны в konsol. Можно спокойно вставлять их в верстку и видеть результат в браузере в реальном времени после перезагрузки страницы браузера.
|
|
98
|
-
|
|
99
|
-
## Деплой проекта и публикация
|
|
100
|
-
@TODO: Тут описываем как собрать и на какие ключевые моменты нужно обратить внимание.
|
|
101
|
-
|
|
102
|
-
### TODO
|
|
103
|
-
- [ ] Разобраться с tailwind чтобы его можно было собрать один раз для проекта консоли и других WL, или как экспортировать конфиги tailwind в front чтобы был отдельный бандл со стилями
|
|
104
|
-
|
|
105
|
-
## Задачи для выполнения
|
|
106
|
-
|
|
107
|
-
### Настройка проекта
|
|
108
|
-
- [x] Настроить автоматическую публикацию в npm
|
|
109
|
-
- [ ] Добавить автоматические тесты
|
|
110
|
-
- [x] Настроить CI/CD пайплайн
|
|
111
|
-
- [ ] Добавить документацию по установке и использованию
|
|
112
|
-
|
|
113
|
-
### Разработка компонентов
|
|
114
|
-
- [ ] Добавить компонент Button
|
|
115
|
-
|
|
116
|
-
### Стилизация
|
|
117
|
-
- [ ] Настроить темную тему
|
|
118
|
-
- [ ] Добавить анимации для компонентов
|
|
119
|
-
- [ ] Улучшить доступность (a11y)
|
|
120
|
-
- [ ] Оптимизировать CSS бандл
|
|
121
|
-
|
|
122
|
-
### Документация
|
|
123
|
-
- [ ] Создать Storybook для всех компонентов
|
|
124
|
-
- [ ] Добавить примеры использования
|
|
125
|
-
|
|
126
|
-
### Оптимизация
|
|
127
|
-
- [ ] Оптимизировать размер бандла
|
|
128
|
-
- [ ] Добавить tree-shaking
|
|
129
|
-
- [ ] Улучшить производительность компонентов
|
|
130
|
-
- [ ] Добавить кэширование
|
|
131
|
-
|
|
132
|
-
### Тестирование
|
|
133
|
-
- [ ] Написать unit тесты
|
|
134
|
-
- [ ] Добавить интеграционные тесты
|
|
135
|
-
- [ ] Настроить e2e тесты
|
|
136
|
-
- [ ] Добавить тесты производительности
|
|
137
|
-
|
|
138
|
-
### Безопасность
|
|
139
|
-
- [ ] Провести аудит безопасности
|
|
140
|
-
- [ ] Добавить проверку зависимостей
|
|
141
|
-
- [ ] Настроить сканирование уязвимостей
|
|
142
|
-
|
|
143
|
-
### Поддержка
|
|
144
|
-
- [ ] Добавить changelog
|
|
145
|
-
- [ ] Настроить автоматическое обновление версий
|
|
146
|
-
- [ ] Создать шаблоны для issues и PR
|
|
1
|
+
Published
|