Прошу помочь исправить одну ошибку (1 строчка кода) при сборке проекта Vue 3?

Question

[sheldon_coop]

Всем привет!

Стек проекта: Vue 3, TypeScript, Vite, Vue Router

Было все хорошо, все работало, никаких проблем.
НО, вчера добавил функцию для скролла/прокрутки к определенным элементам по клику на кнопку/по событию.
npm run dev - все работает как надо, прокрутка РАБОТАЕТ корректно, никаких ошибок в консоле браузера в том числе
а при сборке npm run build вылазит ошибка (во время сборки):

src/components/HomeView.vue:104:29 - error TS2749: 'Ref' refers to a value, but is being used as a type here. Did you mean 'typeof ref'?

104     const scrollTo = (view: Ref<HTMLElement | null>) => {

Found 1 error.

Красным подчеркивает именно "Ref" в 104 строчке
("ref" или "Ref" не имеет значения, ошибка та же)

Функцию брал из этой статьи/мануала:
https://dev.to/cn-2k/how-scroll-to-specific-elemen...

Мой код (скопировал выборочно, только касающиеся функции строки):

<template>
  
  .....

</template>

<script lang="ts">
import { defineComponent, computed, ref } from 'vue';
...
  ...

    const firstElement = ref<HTMLElement | null>(null);
    const secondElement = ref<HTMLElement | null>(null);
    const scrollTo = (view: Ref<HTMLElement | null>) => {
      view.value?.scrollIntoView({ behavior: 'smooth' })
    };

    const handleAdding = () => {
      .....
      scrollTo(firstElement);
    };

    const postEditing = (post: Post) => {
      .....
      scrollTo(secondElement);
    };

  ...

</script>

Может кто-то что-нибудь подскажет на что нужно исправить?
Также буду рад другим простым работающим реализациям для прокрутки к элементу по событию.

Comments

[modelair]

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

в целом зачем HTML-функции реф-тип? пусть тип и был бы html

Answer 1

[sheldon_coop]

Решил проблему сам

Убрал функцию, изменил константы и просто напрямую вызываю прокрутку где нужно
Все работает сборка проходит без ошибок. Другого решения ошибки пока не нашел, нужно было срочно чтобы заработало

const firstElement = ref();
const secondElement = ref();

const handleAdding = () => {
      .....
      firstElement.value.scrollIntoView({ behavior: "smooth" });
};

const postEditing = (post: Post) => {
      .....
      secondElement.value.scrollIntoView({ behavior: "smooth" });
};

Answer 2

[Aragorn]

Может Ref<InstanceType<typeof ref>>?

Comments

[sheldon_coop]

Нет, это так не работает

Answer 3

[Alexandroppolus]

import { defineComponent, computed, ref } from 'vue';

попробуй добавить Ref в список импорта

Comments

[modelair]

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