Best practice в плане импорта компонентов?

Question

[Алексей Николаев]

Доброго утра.
Сразу два примера:

// components/test.js
import test from 'components/test';

// components/test.vue
import test from 'components/test.vue';

// второй вариант
// componsents/test/index.js (опционально components/test/test.js + index.js)
import { test } from 'components/test';

// componsents/test/test.vue + index.js
import { test } from 'components/test';

Является ли заворачивание компонентов в index.js хорошей практикой? Плюс тут в том, что мы можем, во-первых, опустить название файла, а во-вторых, мы можем завернуть дополнительный функционал, например, интерфейс (актуально для TS). Кроме того, путь к импорту становится короче. В структуре проекта, в итоге, становятся нормой папки с двумя файлами: component.js и index.js - такое я видел не раз, и это минус: много лишних файлов для обеспечения этой инфраструктуры.

Ваши мнения?

Answer 1

[Антон Швец]

Если чисто мнение - то нет, так себе практика. Никаких плюсов, перенос файлов в другое место добавляет хлопот.
Только надо

import { TestComponent } from 'components/test.vue';

и автокомплит/автоимпорт в иде позволяет не думать где они вообще расположены.
Индексы делаю иногда только для хелперов или типов, если они объединены по какому-то признаку и часто могут быть импортированы вместе.