JSX元素类型'RouterLink'没有任何构造或调用签名。

15 浏览
0 Comments

JSX元素类型'RouterLink'没有任何构造或调用签名。

我在互联网和堆栈溢出的许多问题中发现了很多关于这个问题的内容，但问题似乎总是与React有关？像这个例子，但是我使用的是Vue，并且错误发生在Vue的自身组件上，这些组件是我新安装的项目中的一部分，我用它们来测试类型和一般的类型提示。\n错误：\nsrc/App.vue:3:6 - 错误 TS2604：JSX元素类型 \'RouterLink\'没有任何构造或调用签名。\n3 Sales Running\n\npackage.json\n{\n \"name\": \"vue-sales-running\",\n \"version\": \"0.1.0\",\n \"private\": true,\n \"scripts\": {\n \"serve\": \"vue-cli-service serve\",\n \"build\": \"vue-cli-service build\",\n \"test:unit\": \"vue-cli-service test:unit\",\n \"test:e2e\": \"vue-cli-service test:e2e\",\n \"lint\": \"vue-cli-service lint\",\n \"watch\": \"build --watch\",\n \"strict\": \"vue-tsc --noEmit\"\n },\n \"dependencies\": {\n \"axios\": \"^0.27.2\",\n \"core-js\": \"^3.8.3\",\n \"i\": \"^0.3.7\",\n \"register-service-worker\": \"^1.7.2\",\n \"tailwindcss\": \"^3.0.24\",\n \"vue\": \"^3.2.13\",\n \"vue-class-component\": \"^8.0.0-0\",\n \"vue-router\": \"^4.0.3\",\n \"vue-tsc\": \"^0.37.1\",\n \"vuex\": \"^4.0.0\",\n \"watch\": \"^1.0.2\"\n },\n \"devDependencies\": {\n \"@types/jest\": \"^27.0.1\",\n \"@typescript-eslint/eslint-plugin\": \"^5.4.0\",\n \"@typescript-eslint/parser\": \"^5.4.0\",\n \"@vue/cli-plugin-babel\": \"~5.0.0\",\n \"@vue/cli-plugin-e2e-cypress\": \"~5.0.0\",\n \"@vue/cli-plugin-eslint\": \"~5.0.0\",\n \"@vue/cli-plugin-pwa\": \"~5.0.0\",\n \"@vue/cli-plugin-router\": \"~5.0.0\",\n \"@vue/cli-plugin-typescript\": \"~5.0.0\",\n \"@vue/cli-plugin-unit-jest\": \"~5.0.0\",\n \"@vue/cli-plugin-vuex\": \"~5.0.0\",\n \"@vue/cli-service\": \"~5.0.0\",\n \"@vue/eslint-config-typescript\": \"^9.1.0\",\n \"@vue/test-utils\": \"^2.0.0-0\",\n \"@vue/vue3-jest\": \"^27.0.0-alpha.1\",\n \"babel-jest\": \"^27.0.6\",\n \"cypress\": \"^8.3.0\",\n \"eslint\": \"^7.32.0\",\n \"eslint-config-prettier\": \"^8.3.0\",\n \"eslint-plugin-prettier\": \"^4.0.0\",\n \"eslint-plugin-vue\": \"^8.0.3\",\n \"jest\": \"^27.0.5\",\n \"prettier\": \"^2.4.1\",\n \"sass\": \"^1.32.7\",\n \"sass-loader\": \"^12.0.0\",\n \"ts-jest\": \"^27.0.4\",\n \"typescript\": \"~4.5.5\"\n }\n}\n\nApp.vue（出现问题的地方）\n\n

\n\n我制作了一个自定义的strict脚本/命令，它执行vue-tsc --noEmit命令，此命令按照我的预期执行，并且如果不符合预期的类型，则停止编译脚本。\n然而，我现在又遇到了另一个问题，那就是我从Vue自己的预构建组件中得到错误，这些组件用于导航？

0

2 答案

0 Comments

问题的原因是由于Vue语言特性（Volar）扩展的版本问题导致的。解决方法是将Volar扩展版本降级到0.36.0。

这个问题与这个问题和这个问题听起来很相似。

虽然Volar不太可能是问题的原因，因为vue-tsc命令是独立运行在命令行中的。

你的答案可以通过添加额外的支持信息来改进。请编辑以添加更多详细信息，例如引用或文档，以便其他人可以确认你的答案是否正确。你可以在帮助中心找到有关如何编写好答案的更多信息。

0
0 Comments

JSX元素类型'RouterLink'没有任何构造或调用签名的问题是由于没有正确导入组件所引起的。解决方法是在App.vue文件中导入所需的组件，然后在<script setup lang="ts">标签中使用这些组件。在Vue 3中，使用组合式API和TypeScript时，需要通过导入组件来进行本地组件注册。这样做可以解决该问题，但注意这只是一个临时的解决方法。

以下是解决该问题的具体步骤：

1. 在App.vue文件的底部导入所需的组件：

<script setup lang="ts">
import { RouterView, RouterLink } from "vue-router";
{
  RouterView;
  RouterLink;
}
</script>

2. 确保使用了<script setup lang="ts">标签，并在其中进行了组件的导入。

在新创建的项目中，我无法复现这个问题。如果你能提供一个复现该问题的链接，那将更有助于定位问题所在。

另外，{ RouterView; RouterLink; }这一块是不必要的，并且没有任何效果。在<script setup>中使用import语句来进行本地组件注册。

0