itube-specs 0.0.781 → 0.0.782
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 +130 -13
- package/package.json +1 -1
package/README.md
CHANGED
|
@@ -1,15 +1,132 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
1
|
+
# itube-specs
|
|
2
|
+
|
|
3
|
+
Общий **Nuxt Layer** для сайтов itube. Держит единую базу: компоненты, composables, сервисы, утилиты,
|
|
4
|
+
runtime-хелперы, типы и lib-данные. Приложения расширяют слой (`extends: ['itube-specs']`) и форкаются
|
|
5
|
+
под разные сайты одной ниши — поэтому слой должен оставаться **самодостаточным и site-agnostic**.
|
|
6
|
+
|
|
7
|
+
> Bitbucket: https://bitbucket.org/luckytube/specs/src/master/
|
|
8
|
+
|
|
9
|
+
---
|
|
10
|
+
|
|
11
|
+
## Стек
|
|
12
|
+
|
|
13
|
+
- **Nuxt 3** + **Vue 3.5**, TypeScript
|
|
14
|
+
- **@nuxt/icon**, **@nuxtjs/i18n**, **@nuxt/eslint** — как модули слоя
|
|
15
|
+
- **ESLint** + **Stylelint** (гейтят на ноль варнингов), **Vitest** (юнит)
|
|
16
|
+
- Публикуется в npm; приложения ставят опубликованную версию
|
|
17
|
+
|
|
18
|
+
**Требования:** Node `>=22.12`.
|
|
19
|
+
|
|
20
|
+
---
|
|
21
|
+
|
|
22
|
+
## Как работать со слоем
|
|
23
|
+
|
|
24
|
+
Слой публикуется в npm, приложения используют **опубликованную** копию (`node_modules/itube-specs`).
|
|
25
|
+
**Локальные правки не видны приложению, пока не опубликована новая версия.**
|
|
26
|
+
|
|
27
|
+
1. Коммитим правки в слое.
|
|
28
|
+
2. `npm run patch` — патчим версию → пуш → мерж.
|
|
29
|
+
3. В проекте: `npm run spec` (`npm install itube-specs@latest`), при необходимости `npx nuxi prepare`
|
|
30
|
+
(если не подхватились автоимпорты composables/компонентов).
|
|
31
|
+
4. При runtime-проблемах — `npm run dev` в слое перегенерит `tsconfig` и `eslint.config.mjs`.
|
|
32
|
+
|
|
33
|
+
> **npm install и другие команды, меняющие зависимости, в этом репозитории не запускаем** — зависимости
|
|
34
|
+
> и публикацию ведёт мейнтейнер вручную. Править `package.json` можно, ставить пакеты — нет.
|
|
35
|
+
|
|
36
|
+
### Отладка из приложения
|
|
37
|
+
|
|
38
|
+
Правим слой прямо здесь (по `LAYER_PATH`), затем `npm run patch` + `npm run spec` в приложении.
|
|
39
|
+
|
|
40
|
+
Чтобы видеть изменения без публикации — **локальный оверрайд** в приложении: копируем компонент/composable
|
|
41
|
+
в проект по **тому же относительному пути** (`components/<...>.vue` / `composables/<...>.ts`), `npx nuxi prepare`
|
|
42
|
+
— копия перекрывает слой на рантайме (приложение выше слоя по приоритету; при `pathPrefix` имя совпадает
|
|
43
|
+
со слоевым). Правим копию, после — переносим в слой, `npm run patch` + `npm run spec`, копию удаляем.
|
|
44
|
+
Импорты в копии чиним на пакетные (`itube-specs/runtime|types|lib|services|utils`).
|
|
45
|
+
|
|
46
|
+
Для мелких утилит/runtime можно и грубее — временный disk-импорт с диска
|
|
47
|
+
(`import { test } from '../../../../specs/runtime/utils'`), только для локальной отладки, в коммит не идёт.
|
|
48
|
+
|
|
49
|
+
---
|
|
50
|
+
|
|
51
|
+
## Команды
|
|
52
|
+
|
|
53
|
+
```bash
|
|
54
|
+
npm run lint # ESLint (гейтит на ноль варнингов)
|
|
55
|
+
npm run lint:fix # ESLint --fix
|
|
56
|
+
npm run lint:css # Stylelint по **/*.{scss,vue}
|
|
57
|
+
npm run lint:css:fix # Stylelint --fix
|
|
58
|
+
npm run test # vitest однократно
|
|
59
|
+
npm run patch # npm version patch — бамп версии перед публикацией
|
|
11
60
|
```
|
|
12
|
-
|
|
61
|
+
|
|
62
|
+
Pre-commit (husky + lint-staged): на закоммиченных файлах прогоняются `eslint --fix` и `stylelint --fix`.
|
|
63
|
+
|
|
64
|
+
---
|
|
65
|
+
|
|
66
|
+
## Структура
|
|
67
|
+
|
|
13
68
|
```
|
|
14
|
-
|
|
15
|
-
|
|
69
|
+
components/ # общие компоненты (pathPrefix: имя = папка + файл)
|
|
70
|
+
composables/ # автоимпортируемые composables (+ fetch/, __tests__/)
|
|
71
|
+
services/ # синглтон-клиенты внешнего API (services/api/*) + SiteDataService
|
|
72
|
+
utils/ # доменные утилиты (file = function, co-located __tests__/)
|
|
73
|
+
runtime/ # runtime-значения и хелперы (barrel index.ts)
|
|
74
|
+
constants/ # доменные `as const` (Niche, PlaylistType, AdSpotType, …)
|
|
75
|
+
utils/ # чистые хелперы, cleaners/, converters/
|
|
76
|
+
types/ # .d.ts типы (barrel index.d.ts — с расширением .d.ts в реэкспортах)
|
|
77
|
+
lib/ # статические scheme/config-данные (barrel index.ts)
|
|
78
|
+
```
|
|
79
|
+
|
|
80
|
+
---
|
|
81
|
+
|
|
82
|
+
## Импорты
|
|
83
|
+
|
|
84
|
+
Внутри слоя — **относительные пути** (`../../runtime`, `../types`, `../../services/api/...`), никогда не
|
|
85
|
+
через имя пакета. Приложения импортируют как `itube-specs/runtime`, `itube-specs/services/...`,
|
|
86
|
+
`itube-specs/utils/...`, а типы — `itube-specs/types`.
|
|
87
|
+
|
|
88
|
+
Алиасы `~/…`/`@/…` в файле слоя резолвятся на **приложение**, не на слой — для кода слоя их не используем
|
|
89
|
+
(допустимо только для намеренных app-зависимостей, например рекламный компонент → `~/config`/`~/utils`).
|
|
90
|
+
|
|
91
|
+
### `files` / `exports`
|
|
92
|
+
|
|
93
|
+
`package.json` определяет, что публикуется и как резолвится. Добавляя новую top-level папку, которую
|
|
94
|
+
импортируют приложения:
|
|
95
|
+
- добавь её в **`files`** (иначе код не попадёт в пакет);
|
|
96
|
+
- добавь **`exports`**: barrel'ы (`types`/`runtime`/`lib`) — явные index-энтри; extensionless-сабпасы
|
|
97
|
+
(`services`/`composables`/`utils`) — паттерн с `.ts` (`"./services/*": "./services/*.ts"`); компоненты
|
|
98
|
+
импортятся с `.vue` и идут через `"./*": "./*"`.
|
|
99
|
+
|
|
100
|
+
Типы экспортируются из `types/index.d.ts` — **обязательно с расширением `.d.ts`** в реэкспортах.
|
|
101
|
+
|
|
102
|
+
---
|
|
103
|
+
|
|
104
|
+
## Что живёт в слое, а что в приложении
|
|
105
|
+
|
|
106
|
+
- **Слой:** переиспользуемые компоненты, composables, API-сервисы, доменные утилиты, runtime-константы/хелперы,
|
|
107
|
+
типы, scheme/lib-данные — всё site-agnostic.
|
|
108
|
+
- **Приложение:** фича-флаги и прочий `config/`, `assets/scss` (токены), плагины (`$features`, реклама,
|
|
109
|
+
sentry), страницы, i18n-локали, BFF-хендлеры `server/` — всё site-specific и завязанное на окружение.
|
|
110
|
+
|
|
111
|
+
---
|
|
112
|
+
|
|
113
|
+
## Конвенции
|
|
114
|
+
|
|
115
|
+
Полные правила — в [**CLAUDE.md**](./CLAUDE.md). Кратко:
|
|
116
|
+
|
|
117
|
+
- **Компоненты** — `pathPrefix: true`: имя = папка + файл (`ui/icon.vue` → `<UiIcon>`), BEM-класс = kebab
|
|
118
|
+
тега. Корень папки — `index.vue` (или `main.vue`, если иначе имя было бы односложным).
|
|
119
|
+
- **`as const`** вместо `enum` — доменные наборы в `runtime/constants/`.
|
|
120
|
+
- **Стили** — co-location в `<style lang="scss">` без `scoped`, flat-BEM, только дизайн-токены.
|
|
121
|
+
⚠️ Токены (`vars`/`mixins`) инжектит **приложение** — в слое нет `assets/scss` и `sass`, стили компонентов
|
|
122
|
+
компилируются только внутри приложения.
|
|
123
|
+
- **Разметка** — семантические теги, `<div>` только когда ничего не подходит.
|
|
124
|
+
- **TS/JS** — всегда точка с запятой, без лишних комментариев.
|
|
125
|
+
|
|
126
|
+
---
|
|
127
|
+
|
|
128
|
+
## Тесты
|
|
129
|
+
|
|
130
|
+
Vitest через `@nuxt/test-utils`. В слое — **только тесты без app-специфичного окружения** (чистая логика
|
|
131
|
+
composables/utils/runtime). Компонентные тесты с монтированием SFC и всё, что требует app-инжектов
|
|
132
|
+
(`$features`, SCSS-токены), живёт в **приложении** — в слое нет ни scss-инъекции, ни плагинов приложения.
|