Версия библиотеки 2.0 (И Яндекс Карты 3.0) #60
Replies: 4 comments 33 replies
-
|
@daniluk4000 Привет. Хотел поиграться с текущим кодом, но у меня не получилось запустить карты на nuxt 2 и vue 2. Первая ошибка была в функции export function isDev() {
// @ts-expect-error
return (typeof process !== 'undefined' && process.env?.NODE_ENV === 'development') || (import.meta?.env?.DEV);
}Похоже Дальше я хотел посмотреть на работу карты, но у меня падает страница с ошибками:
Как я понял это связано с тем, что вы писали выше "Данная версия поддерживает Vue 2/Nuxt 2/Nuxt Bridge через жертву в виде написания кода template через return в setup. Любые другие решения не работают и теряют совместимость" Пробую возвращать в функции setup() рендер функцию, но она не исправляет ситуацию, ошибки такие же. Пример кода. import { defineComponent, h } from 'vue';
import {
YandexMap,
// YandexMapDefaultFeaturesLayer
YandexMapDefaultSchemeLayer,
} from 'vue-yandex-maps';
export default defineComponent({
setup() {
return () => {
// @ts-expect-error
return h(YandexMap, {
props: {
width: '50dvw',
height: '75dvh',
settings: { location: { center: [37.588144, 55.733842], zoom: 7 } }
}
// @ts-expect-error
}, [h(YandexMapDefaultSchemeLayer, {}, {props: {settings: { theme: 'dark' }}})])
}
}
});Как можно исправить проблему, чтоб посмотреть на работу карты? |
Beta Was this translation helpful? Give feedback.
-
|
Версия Vue 2.7.14. Модуль установлен. 10 Винда, 20 нода, chrome. Что я делал:
Ошибка при сборке, если не править isDev
Для своего примера я убрал почти все, чтоб попытаться понять в чем проблема, взял только YandexMap и слой, чтоб запустить карту. Про токен вкурсе, с 3 версией карт уже работал. Решил пока свой не ставить, т.к если запустить 3 пример карт на vue 3, они работают и там карта грузится. Стоит ваш токен, значит сделал вывод, что дело не в нем. |
Beta Was this translation helpful? Give feedback.
-
|
Очень интересно. В выходные постараюсь посмотреть. Возможно, я что-то сломал, оно работало)) Спасибо! В целом я карты уже заводил на реальном Nuxt 3 проекте, на Vue 2 честно пока только в демке, но существенных различий быть не должно. |
Beta Was this translation helpful? Give feedback.
-
|
Нашел проблему. Vue 2 не любит такие манипуляции со слотами, которые делал я :) Также почитал, Evan You говорит, что общение между слотом и родителем через эмит слишком непредсказуемое, поэтому они это не реализовали. А я судя по всему сделал что-то не совсем законное :D Остальные ошибки также починил. Опубликовал 2.0.0-alpha.15. |
Beta Was this translation helpful? Give feedback.
-
|
Да сейчас на nuxt 2 запускается. Хотел еще один вопрос прояснить. У Vue 2.7 есть нативная поддержка composition api, исходя из этого возникает вопрос, можно ли убрать плагин Для теста решил проверить пример
Как итог карта не запустилась.
Предупреждения появляются внутри
|
Beta Was this translation helpful? Give feedback.
-
|
Тут всё просто.
|
Beta Was this translation helpful? Give feedback.
-
|
@daniluk4000 Добрый день. Тоже решил провести эксперимент с картой на vue3 - есть потребность поменять location у нее после монтирования (location прокинут через pinia хранилище). В коде вижу отсылку, что settings не реактивно и надо пользоваться setLocation. Однако с кодом ниже ничего не работает: watch отрабатывает, метод setLocation вызывается, но карта остается там же, где и была. Других методов как мне получить рабочий экземпляр карты и у него поменять параметры я не нашел. Можешь подсказать? |
Beta Was this translation helpful? Give feedback.
-
|
Таким образом я отбираю свободу у разработчика. В общем я запишу себе в туду, это вполне реально поработать так, чтобы было кайфом. То, что оно работает, я знаю) |
Beta Was this translation helpful? Give feedback.
-
|
И чем отбирается свобода? |
Beta Was this translation helpful? Give feedback.
-
|
А, имеется в виду передача настроек анимации в location прям в settings Тут есть другой момент - нужно будет модифицировать немного объект настроек: по хорошему не передавать поля с анимацией при инициализации карты, кроме того, надо будет расширить YMapProps и заменить там location на объект настроек setLocation - иначе тайпскрипт не будет рад Как и сказал, запишу в туду) |
Beta Was this translation helpful? Give feedback.
-
|
До RC сделаю |
Beta Was this translation helpful? Give feedback.
-
|
Смешная история, на самом деле. Делал вчера новые примеры и решил заодно это сделать. Вы упоминали, что Яндекс в своей обертке для реакта сделали это, но на самом деле в примере они всё меняют вручную через setLocation/setBounds и тд) Это забавно И да - там Яндексом всё из коробки поддерживается, всё лучше, чем я думал, даже типы не пришлось менять. Немного подхимичил с изменением location/camera, в остальном реализация полностью нативная. |
Beta Was this translation helpful? Give feedback.
-
|
@daniluk4000 Есть не только у дев тулзов проблема с производительностью. Возможно это только на vue 2.7 или я где-то в коде косяк сделал, но плавность при раскрытии большого кластера уходит. Я открыл условно Питер, где очень много маркеров и кластеров, выбрал большой кластер, раскрыл его(сделал зум в область кластера, часть маркеров из кластера показались) и плавность ушла. Вместо 60 кадров стало 30. Далее эти 30 кадров уходили на другие города, если я просто меняю локацию и количество кластеров и маркеров. Чтобы починить плавность для других локаций, где маркеров может быть мало, нужно убивать карту и заново ее рендерить. |
Beta Was this translation helpful? Give feedback.
-
|
Beta Was this translation helpful? Give feedback.
-
|
@Batyodie и это снова я. Прокачал кластер. 5 тысяч элементов щелкает как орешки. Выкатил в |
Beta Was this translation helpful? Give feedback.
-
|
@daniluk4000 Привет. Круто! Как будет время, посмотрю. Есть сейчас понимание, когда проект можно будет поставить через npm? Сейчас не очень удобно его тестировать. |
Beta Was this translation helpful? Give feedback.
-
|
@Batyodie а вы как ставили?) Сочувствую Версия уже в npm под тэгом https://yandex-maps-unofficial.github.io/vue-yandex-maps/guide/vue3.html |
Beta Was this translation helpful? Give feedback.
-
|
@daniluk4000 Понял, не знал. Я билдил проект локально в ручную, потом исходники переносил куда мне нужно. |
Beta Was this translation helpful? Give feedback.
-
|
Добый день. |
Beta Was this translation helpful? Give feedback.
-
Всем привет! Для начала, хотел бы представиться - меня зовут Данил и я буду помогать @PNKBizz с обслуживанием этой библиотеки, я же сделал версию либы 2.0 (и буду отвечать на вопросы/баги по ней).
Текущий статус
Выпущен релиз кандидат.
Документация.
Статус готовности к релизу можно отслеживать в Milestone 2.0.
Что такое vue-yandex-maps 2.0
Библиотека была, по сути, написана с нуля.
Что изменилось
Изменения по сравнению с 1.0 (и другими)
Улучшения по сравнению с Картами 3.0 (vanilla)
Изменения в Картах 3.0 читайте на сайте Яндекса.
Процесс релиза
В рамках релиза я планирую идти по схеме, где:
Релизную версию я планирую выпустить до конца года.
FAQ
Почему так долго?
Библиотеку я пишу в свободное время по выходным.
Тяжело будет переходить?
Да. Готовьтесь к тому, что код нужно будет писать с нуля. Я постараюсь сделать настолько подробный Migration Guide, насколько это возможно, но всего он не покроет.
Причина этому не столько то, что всё было написано с нуля, сколько полностью изменившееся API Яндекса. Можете почитать их Migration Guide - он, мягко говоря, не покрывает всего, что они поменяли.
Что будет с репозиторием vue-yandex-map и версией 1.0.0?
Решение примет @PNKBizz, но в моём понимании 1.0.0 прекратит поддержку, а репозиторий vue-yandex-map станет readonly и будет вести на этот репозиторий через Readme.
Когда будет бета?
Бета-версию я планирую выпустить в сентябре-октябре.
Если тебя собьет машина, то как библиотека будет поддерживать актуальность?
Большинство настроек сделано таким образом, что вы сможете самостоятельно обновлять версию @yandex/ymaps3-types и получать актуальную типизацию. В том числе поэтому настройки передаются через settings, а не отдельные props.
В случае, если Яндекс добавит новые компоненты, и некому по каким-то причинам будет добавить их в библиотеку (по ряду причин), вы всегда сможете добавить компоненты через инстанс карты (addChild/addLayer и пр.), как указано в документации Яндекса.
Vue 2 будет поддерживаться вечно?
Нет. Данная версия поддерживает Vue 2/Nuxt 2/Nuxt Bridge через жертву в виде написания кода template через return в setup. Любые другие решения не работают и теряют совместимость.
В таком виде поддержку планирую продолжать как максимум до момента, пока библиотеку будет невозможно поддерживать и сохранять обе версии. После этого версию для Vue 2 придется дропнуть, а Vue 3 переписать на нормальную интеграцию с
<template>и потенциально<script setup>в версии по типу v3.Также рассмотреть дроп поддержки планирую после официального окончания поддержки Vue 2 (декабрь 2023) + еще несколько месяцев.
После дропа поддержки будет выпущена версия 3.0, где будут внесены Breaking Changes (по необходимости) и внедрены нормальные template.
Цель же сейчас - дать пользователям Vue 2 возможность использовать Карты 3.0 (а заодно избавиться от страданий в виде двух разных версий пакетов).
Данный пост я написал, чтобы немного посвятить вас в свои планы, так как, уверен, Карт 3.0 ждут многие. Лично мне они понравились своей скоростью работы и возможностью нормально сделать реактивность. Код на них, пока что, писать было удовольствием.
Если у кого-то здесь есть ещё вопросы, буду рад на них ответить :)
Beta Was this translation helpful? Give feedback.
All reactions