VueJS: при полной загрузке изображений vuе не видит размеры?

Игорь, посмотрите выше, где массив childrenHeights создается

VueJS: при полной загрузке изображений vuе не видит размеры?

Игорь, потому, что vm.$el.clientWidth / vm.$el.clientHeight равно NaN, так как vm.$el.clientWidth и vm.$el.clientHeight равны 0, а 0 / 0 = NaN. об этом я и пишу, размеры еще не готовы

VueJS: минусы компонентной структуры?

Игорь, спасибо за комментарии)

VueJS: минусы компонентной структуры?

Evgeny Kulakov, спасибо за комментарии)

VueJS: минусы компонентной структуры?

Игорь, я кстати не смог в песочнице реализовать доступ к переменным стилей из компонентов, по этому цветом обычным вхерачил значения)) ну и не ставил либы для стилей, тоже почему-то не работало в песочнице, но сам посыл ясен)

VueJS: минусы компонентной структуры?

Evgeny Kulakov, может вы не поняли изначально, какая именно структура.

https://codesandbox.io/s/vue-template-vdozv

я тут немного набросал. есть и пример с двумя компонентами в папке, это компонент Header

VueJS: минусы компонентной структуры?

Игорь, представьте, что папка с именем компонента - это приложение, а index.vue - это точка входа приложения)))

я все-таки набросал быстренько переключение темы, со своей структурой, посмотрите, может вы прозреете))

https://codesandbox.io/s/vue-template-vdozv

VueJS: минусы компонентной структуры?

Evgeny Kulakov,

order\
index.vue
header\
index.vue
tabs\
index.vue
content\
index.vue
somefeature\
index.vue

я по другому строю структуру.

пример с Order:

Order\
    index.vue
    Content.vue 
    Header.vue
    HeaderTabs.vue

имена получаются у этих компонентов такие:

index.vue             name: 'Order'
Content.vue         name: 'OrderContent'
Header.vue          name: 'OrderHeader'
HeaderTabs.vue   name: 'OrderHeaderTabs'

я делаю структуру так, чтобы вложенных подпапок небыло, и да, это возможно)

VueJS: минусы компонентной структуры?

Игорь, проглючило меня)

VueJS: минусы компонентной структуры?

Игорь, ну плоскую структуру я не использую)) особенно фишки из документации типа TheSidebar, BaseButton и т.д.)

VueJS: минусы компонентной структуры?

Evgeny Kulakov, у меня компоненты получают имя с префиксом неймспейса, я же писал в вопросе.

VueJS: минусы компонентной структуры?

Игорь, и если вы будете писать в стилях компонента только то, что нужно компоненту для внешнего вида, то и файлы стилей дополнительные не нужно создавать, все компактно должно умещаться в файле .vue.

VueJS: минусы компонентной структуры?

Evgeny Kulakov, в том то и дело, что у вас структура сложная) ее нужно разделить еще лучше, это вам наверное удобно, вы привыкли. а если новые люди придут?)

VueJS: минусы компонентной структуры?

Игорь,

Не получилось бы так, что перемешаются кони и люди.

ну это же просто делается))
если хотите я могу вам после работы набросать рабочий шаблон по быстрому, с переключением тем (светлой и темной).

Ладно, ок, но вам всё ровно нужно создавать файл с общими стилями.

я немного не понял зачем.
вот у вас есть компонент News.vue. в нем вы описываете просто внешний вид, без лишней логики.

А сброс стилей, анимации, глобальные стили, хелперы, все что может применяться ко всем компонентам, например хелперы флексбокса, анимации и т.д. нужно описывать в папке стилей))

в общем, что косается именно компонента - находится в компоненте. все общее уходит в папку стилей. и это уже будет больше похоже на стайл SFC)

в общем если хотите покажу вечером

VueJS: минусы компонентной структуры?

недостатком таковой является путаница в случаях когда компоненты/модули пересекаются в дереве, к примеру когда 2 ветки используют один и тот же компонент

это как? можете пример показать? я не пойму в чем проблема.

Я больше предпочитаю структуру ориентированную на зоны ответственности.

можете тоже пример показать, или ссылку на репо?

VueJS: минусы компонентной структуры?

Evgeny Kulakov, у вас есть гит, может ссылку на репо скинете, я посмотрю вашу структурю в жизни? или хотябы скрины с редактором, с расскрытыми папками, чтобы видно было название файлов.
может вдохновлюсь

VueJS: минусы компонентной структуры?

Evgeny Kulakov, ну я хочу что-то более универсальное, чтобы во всех проектах использовать не заморачиваясь. у меня 3 приложения, редактор (где одна вьюха) и 2 сайта.

VueJS: минусы компонентной структуры?

Evgeny Kulakov, гораздо удобнее в папку со стилями выносить код, который похож на библиотеку, хелперы, что-то общее. что касается именно компонента, то разделять компонент по файлам плохая идея, когда вы используете SFC. смысл тогда вообще от vue?) пользовались бы реактом) хотя там тоже вроде можно это настроить

VueJS: минусы компонентной структуры?

Игорь, очень просто))

в компоненте добавить еще один блок стилей без scoupe и будет вам счастье)

<style lang="stylus">
.theme
  &-dark
    .main-footer
      background-color theme-color('dark', 'lighten-1')
      border-top 1px solid theme-color('dark', 'darken-3')
  &-light
    .main-footer
      background-color theme-color('light', 'base')
      border-top 1px solid theme-color('light', 'darken-3')
</style>

по сути результат один и тот же, что у вас, что в моем примере, только если компонент изменили или удалили, то не нужно идти в папку стилей, все при себе, как раз это показывает всю прелесть SFC!

VueJS: минусы компонентной структуры?

HeTpe3B правильно написал, мне именно компонентная структура важна, а гайд nuxt'a по модулям это тоже не вариант, я считаю, что это лишнее.

вчера мне подсказали про feature slices, вроде норм тема, но вместе с atomic design, а atimic design мне тоже не нравится, вот я и в поиске решения, которое меня устроит, но что-то я ни как не найду его...