Когда я пытаюсь добавить vueuse через карту импорта, например @vueuse/core": "https://www.unpkg.com/@vueuse/core?module — по какой-то причине у меня не работает реактивность в vueuse.
Импорт, похоже, работает так, как ожидалось, и я не получил никаких ошибок, но без реакции.
🤔 А знаете ли вы, что...
С помощью JavaScript можно создавать клиентские приложения для мобильных устройств с использованием фреймворков, таких как React Native и NativeScript.
Параметр модуля требует, чтобы все записи, связанные с Vue, в карте импорта были загружены из unpkg:
Расширяет все «голые» спецификаторы импорта в модулях JavaScript для распаковки URL-адресов. Эта функция очень экспериментальная.
На этой игровой площадке этого не делается, и в результате создается дубликат vue копии, загруженной @vueuse/core? из unpkg:
"imports": {
"vue": "https://play.vuejs.org/vue.runtime.esm-browser.js",
"vue/server-renderer": "https://play.vuejs.org/server-renderer.esm-browser.js",
"@vueuse/core": "https://www.unpkg.com/@vueuse/core?module"
},
Множественные копии Vue — известная причина потери реактивности.
Это необходимо исправить, изменив vue и т. д., чтобы использовать unpkg. Или ?module не следует использовать, а нужно добавить правильное дерево зависимостей в карту импорта (демо):
"imports": {
"vue": "https://play.vuejs.org/vue.runtime.esm-browser.js",
"vue/server-renderer": "https://play.vuejs.org/server-renderer.esm-browser.js",
"@vueuse/core": "https://www.unpkg.com/@vueuse/[email protected]/index.mjs",
"@vueuse/shared": "https://www.unpkg.com/@vueuse/[email protected]/index.mjs",
"vue-demi": "https://www.unpkg.com/[email protected]/lib/index.mjs"
},