<p>Vue-Router를 Vitest로 조롱하는 논리를 이해하려고 노력 중입니다. </p> <p>이를 위해 매우 간단한 프로젝트에서 테스트 환경을 설정하고 시뮬레이션해 보았습니다. Vue-Test-Utils의 공식 문서를 따르려고 하면 항상 오류가 발생합니다. 그들이 Jest를 사용하기 때문인지는 모르겠습니다. </p> <p>실제 vue-router를 사용하면 문제가 해결되었지만 vue-router를 모의하는 것이 더 낫다고 생각합니다. </p> <p> 아래에서는 먼저 프로젝트의 소스 코드를 전달한 다음 제가 받은 오류를 설명하겠습니다. </p> <h3>Home.vue</h3> <pre class="brush:php;toolbar:false;"><스크립트 설정 lang="ts"> "vue"에서 {onMounted}를 가져옵니다;; "vue-router"에서 {useRoute}를 가져옵니다;; const 경로 = useRoute() onMounted(() => { console.log(route.query) }) </스크립트> <템플릿> <div>홈</div> </템플릿></pre> <h3>首页.spec.ts</h3> <pre class="brush:php;toolbar:false;">"vitest"에서 {expect, it, vi}를 가져옵니다;; "@vue/test-utils"에서 {mount}를 가져옵니다;; "../src/comComponents/Home.vue"에서 홈을 가져옵니다. it('홈 테스트', async () => { const 래퍼 = 마운트(홈) 기대(래퍼.존재()).toBeTruthy() })</pre> <h3>vite.config.ts</h3> <pre class="brush:php;toolbar:false;">/// <참조 유형="vitest" /> 'vite'에서 { 정의 구성 } 가져오기 '@vitejs/plugin-vue'에서 vue 가져오기 // https://vitejs.dev/config/ 기본 정의 구성 내보내기({ 플러그인: [vue()], 시험: { 환경: 'jsdom', 포함: ['./test/**/*.spec.ts'], 제외: ['node_modules', 'dist'], 전역 : 사실 } })</pre> <h3>내가 좋아하는错误消息如下：..</h3> <h3>내가 좋아하는 방법</h3> <p>我尝试image下면这样模拟 vue-router</p> <pre class="brush:php;toolbar:false;">vi.mock('vue-router', () => ({ useRoute: vi.fn(), }))</pre> <p>或者只是</p> <pre class="brush:php;toolbar:false;">vi.mock('vue-router')</pre> <h4>这是我的最终 Home.spec.ts 文件</h4> <pre class="brush:php;toolbar:false;">"vitest"에서 {expect, it, vi}를 가져옵니다;; "@vue/test-utils"에서 {mount}를 가져옵니다. "../src/comComponents/Home.vue"에서 홈을 가져옵니다. vi.mock('vue-라우터') it('홈 테스트', async () => { const 래퍼 = 마운트(홈, { 글로벌: { 스텁: ["라우터-링크", "라우터-뷰"] } }) 기대(래퍼.존재()).toBeTruthy() })</pre></p>