я не хотел, чтоб классы высчитывались динамически

Не меняешь модификаторы у блоков/элементов, не миксуешь классы в зависимости от состояния в приложении?

миксую миксую

но я лучше это буду отдельно делать

чем позволю все динамически все генерировать

чем позволю все динамически все генерировать

Почему? Это же чертовски удобно.

ну честно говорят твой плагин не особо удобно выглядит.

но я лучше не могу придумать, а на директивах я реализовать свое не смог

да я не про плагин, мне интересен твой кейс разработки

мой кейс разработки простой. Я пилю проект в котором нету много динамического, поэтому мне хватает постхтмл

но я лучше не могу придумать, а на директивах я реализовать свое не смог

Если надо, давай вместе подумаем :) Ты хочешь синтаксис как в posthtml-bem?

да

очень удобно выглядит

ну я сейчас уже на нем страницу сверстал, нормально, путаницы пока нет

ну я сейчас уже на нем страницу сверстал, нормально, путаницы пока нет

ну директивах в Vue так красиво выглядеть не будет, т.к. тут нужен префик "v-", т.е. v-block. Не знаю, так себе выглядит.

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

на деритктивах я планировал делать так v-block.blockName v-el.elemName

Либо глобально миксить, но это плохой вариант

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

т.е. <div v-block.name> <div v-el.nameEl> </div> </div>

выполняется сначала v-el, потом v-block

а нужно наоборот, чтоб элемен знал от кого брать значения

а vue-bem тебе не зашел? Даже аккуратнее смотриться

поэтому я забил и подключил постхтмл)

ну честно говоря нет, мне не понятно че за c, b, префиксы

потом меня не устроило, что значение он берет из имени компонента.

у меня случай такой, что наставник по проекту, просит, чтоб компонентами не разрастал проект.

<div block="notifications"> <div elem="item" v-for="notification in notifications" :class="typeNotify(notification)" > <div elem="title" v-if="notification.title"> {{ notification.title }} </div> <div elem="message"> {{ notification.text }} </div> </div> </div>

ну честно говоря нет, мне не понятно че за c, b, префиксы

да эт неймспейсы просто)

например можно разделить на notifications, и notification компоненты

но я не делю

потом меня не устроило, что значение он берет из имени компонента.

Ну это можно поправить, брать из кастомной опции как у меня. пару строк кода.

<div block="notifications"> <div elem="item" v-for="notification in notifications" :class="typeNotify(notification)" > <div elem="title" v-if="notification.title"> {{ notification.title }} </div> <div elem="message"> {{ notification.text }} </div> </div> </div>

хз, я б даже тут по БЭМу разбил бы notifications и notification на 2 блока

у меня случай такой, что наставник по проекту, просит, чтоб компонентами не разрастал проект.

ну это такой... специфичный кейс) Может он не прям так буквально имел ввиду? :)

Верно. Но у меня условие чтоб не увлекался разделением.

Я его верно понял.

привет, парни, мб кто сталкивался, вебпак изображения из вложенных (@import "component.scss") файлов не копируюет в dist , хотя если поменять путь с /img/path/name.png на ./img/path/png ругается. ERROR in ./~/css-loader!./~/sass-loader/lib/loader.js!./assets/sass/app.scss Module not found: Error: Can't resolve './img/search-fly-dot.png' in 'proj/assets/sass' — Структура такая: app.scss // Из этого берет /components /- hero.scss // Из этих файлов не берет ссылки на изображения /- etc

Надеюсь ;)

ребзь, какие инструменты вы используете, для разработки? типо блок схемки нарисовать там

ребзь, какие инструменты вы используете, для разработки? типо блок схемки нарисовать там

Draw.io

удваиваю draw.io , если нужно рисовать честные графы (а не накидать квадратиков) - то еще и yed

привет, парни, мб кто сталкивался, вебпак изображения из вложенных (@import "component.scss") файлов не копируюет в dist , хотя если поменять путь с /img/path/name.png на ./img/path/png ругается. ERROR in ./~/css-loader!./~/sass-loader/lib/loader.js!./assets/sass/app.scss Module not found: Error: Can't resolve './img/search-fly-dot.png' in 'proj/assets/sass' — Структура такая: app.scss // Из этого берет /components /- hero.scss // Из этих файлов не берет ссылки на изображения /- etc

Кинь конфиг

Что-то было

Кинь конфиг

https://gist.github.com/codev0/3354186b636511ea3d7fbde38e0e8fb9#file-gistfile1-txt-L21

всем привет, у меня есть список, который рендерится из обьекта(ну вы поняли, базовый пример), можно ли как-то каждому элементу списка добавлять атрибут, например, value="d$", где $ - порядковый номер?

всем привет, у меня есть список, который рендерится из обьекта(ну вы поняли, базовый пример), можно ли как-то каждому элементу списка добавлять атрибут, например, value="d$", где $ - порядковый номер?

Да, посмори доку про рендер списков и апи к v-for

https://gist.github.com/codev0/3354186b636511ea3d7fbde38e0e8fb9#file-gistfile1-txt-L21

options: { name: 'img/[name].[ext]?[hash]', publicPath: '/' }

должно помочь

удваиваю draw.io , если нужно рисовать честные графы (а не накидать квадратиков) - то еще и yed

За yed спасибо?

Да, посмори доку про рендер списков и апи к v-for

я новичок, доку почитал и ничего не нашел похожего, может, поможете?

всем привет, у меня есть список, который рендерится из обьекта(ну вы поняли, базовый пример), можно ли как-то каждому элементу списка добавлять атрибут, например, value="d$", где $ - порядковый номер?

там же index можно получить в v-for

v-for="(value, index) in list"

options: { name: 'img/[name].[ext]?[hash]', publicPath: '/' }

чет не работает :(

и вставляй его куда хочешь

я новичок, доку почитал и ничего не нашел похожего, может, поможете?

https://ru.vuejs.org/v2/api/#v-for

я новичок, доку почитал и ничего не нашел похожего, может, поможете?

если порядковый номер в массиве или ключ в объекте, то можно средствами v-for, но вообще computed надо использовать, чтобы подготовить данные для рендера в таком формате в котором он их ждет

а, вы там про объект…

тогда с каунтером…

а лучше через computed создать список, правда странно все это…

чет не работает :(

Сделай npm run build, посмотри, куда он складывает картинки и что пишет в url-ы в css. Соответственно можно подогнать пути

Сделай npm run build, посмотри, куда он складывает картинки и что пишет в url-ы в css. Соответственно можно подогнать пути

изображение из app.scss background: url(//img/tripfinder.jpg?a5faff5d765625c7e72e724772f6cb35); из app.scss/components/hero.scss background-image: linear-gradient(rgba(0, 0, 0, 0.3), rgba(0, 0, 0, 0.3)), url("/img/front-bg2.jpg");

картинки он обработал только из app.scss, и положил в `/dist/img/

а ты первый слеш из нейм убрал?

а ты первый слеш из нейм убрал?

нет, но не помогло, проверил только что

интересно что во всех туторах про это речи нет, будто это такого не должно быть :(

Это не относится к vue, проблема в настройке file-loader'a

ERROR: S client not available

Это не относится к vue, проблема в настройке file-loader'a

я понимаю, и стили у меня отдельно от vue живут. все уроки по вебпаку которые я смотрел и читал, ничего про это не говорят. пропробую url-loader.

@c01nd01r подскажи, что за прикол с vue?

@c01nd01r подскажи, что за прикол с vue?

Ничего не обещаю, но давай)

если я пытаюсь выводить 2 компонента с разными данными

<errors :remote-error="uploadError" /> <errors v-if="submitted" :errors="errors" />

то 2 не выводится, только первый

если делаю парными

<errors :remote-error="uploadError"></errors> <errors v-if="submitted" :errors="errors"></errors>

то нормально выводятся

если размещаю не парными в разные блоки <div elem="side"> <errors :remote-error="uploadError" /> </div> <div elem="side"> <errors v-if="submitted" :errors="errors" /> </div>

то тоже норм

?

А submitted точно одинаковый в обоих случаях (парные/непарные )

да

если я вообще submitted уберу

то все равно отображаться не будет

интересно. Версия Vue какая? Пробовал это воспроизвести в каком-нить jsbin/codepen?

2.2.1

нет, но вломовато как-то

я vue без vue-loader не работал почти

:)

ща, подожи

а лучше через computed создать список, правда странно все это…

а как он индекс внутрь получит?

с одиночными тегами вообще беда походу

<errors :remote-error="remoteError" /> <button class="profile-form-send" ref="submit" type="submit">Сохранить</button>

button не создает

а как он индекс внутрь получит?

computed преобразует объект в массив

я новичок, доку почитал и ничего не нашел похожего, может, поможете?

https://jsfiddle.net/vz0zo4du/

computed преобразует объект в массив

а, ты так имеешь ввиду. Ну это смотря какой у него объект. Так то мы и объект списком отрендерить можем.

с одиночными тегами вообще беда походу

хм... Слушай, да. В 2.2.1 действительно не работает.

и в 2.2.2

в баг репорт писать?