programing

vue-router를 typescript와 함께 사용하려고 할 때 "No overload matches this call"이 발생한다.

bestcode 2022. 8. 17. 23:50
반응형

vue-router를 typescript와 함께 사용하려고 할 때 "No overload matches this call"이 발생한다.

필사적으로 vue와 vue-router를 타이프스크립트로 동작시키려 하고 있으며, 라우터에 항상 문제가 발생하고 있습니다.

팀에 부과된 제한으로 인해 노드 및 패키지 매니저를 사용할 수 없기 때문에 vue 및 vue-router를 설치하는 스크립트 방식을 사용해야 합니다.

<script src="~/scripts/libs/vue/vue.js"></script>
<script src="~/scripts/libs/vue-router/vue-router.js"></script>

위의 vue 설치 방법뿐만 아니라 Import 및 require()도 사용할 수 없기 때문에 번들 도구도 사용할 수 없습니다.

vue와 typescript를 조합하는 것 자체로는 문제가 없지만 어떤 이유로 vue-router를 사용하려고 해도 라우터에서 vue를 픽업할 수 없습니다.매뉴얼에 기재되어 있는 대로 라우터를 사용하려고 하면 "No overload matches this call"이라는 메시지가 나타납니다.

이 루트를 따라갈 때는 다음을 사용합니다.

const homeComponent = { template: "<div>Home</div>" };

const routes = [
    { path: "/", component: homeCompoent }
];

const router = new VueRouter({routes});
Vue.use(VueRouter);

const app = new Vue({
    el: "#app",
    router,
    data: { intl: Resources }
});

라우터의 과부하가 없기 때문에 타이프 스크립트의 문제가 발생하기 시작한 것입니다.또, 문서의 예를 따르려고 해도, 타이프 스크립트로부터 오버로드 에러가 발생합니다.

** 편집 **

실제 문제가 무엇인지는 정리했다고 생각하지만, 그 이유와 해결 방법에 대해서는 아직 난감합니다.

똑같은 문제가 제가 사용하려고 했던 다른 라이브러리에서도 나타나고 있습니다. 타이프 스크립트가 문제가 될 수 있습니다.vue-router의 경우, 실제 문제는 다음과 같습니다.Vue오브젝트에는 라우터 오브젝트에 대한 정의가 포함되어 있지 않기 때문에 매뉴얼에 나타나 있듯이 그 오브젝트를 사용하려고 하면 당연히 typescript에 오류가 발생합니다.현재 vue-router에 대한 유형 정의를 가지고 있지만, 제가 볼 때 유형 정의가 사용되지 않거나 오류가 발생하여 vue-router를 업데이트할 수 없습니다.Vue정확하게 반대하다

컴포넌트를 정의하는 것이 아니라 오브젝트만 제공합니다.없습니다.ComponentOptions정의되어 있기 때문에 실패합니다.컴포넌트로만 구성(스펠링도 정확)

const homeComponent = Vue.component('home-component', {
  template: '<div>Home</div>'
})

이제 적절한 컴포넌트이며ComponentOptions에러는 발생하지 않습니다.matched정의되어 있지 않습니다(이것은 이 속성입니다).$140):

const routes = [
  { path: "/", component: homeComponent }
];

언급URL : https://stackoverflow.com/questions/59253962/no-overload-matches-this-call-when-trying-to-use-vue-router-with-typescript

반응형