TS2345错误：Vue router-link添加id属性后构建失败

给<router-link>加id属性后执行yarn run build触发TS2345错误，VS Code未提示该问题，又需要保留id用于元素获取，这里给你两个实用解决办法：

• 自定义渲染模式（推荐）
  用Vue Router的custom属性结合插槽，自行渲染底层的<a>标签，直接把id加在a标签上，既不破坏路由导航功能，又能让TypeScript通过检查：

  <router-link to="/account/cards" custom v-slot="{ navigate }">
    <a id="yourCardsLink" class="dropdown-link" @click="navigate">
      你的卡片
    </a>
  </router-link>
  

• 扩展RouterLink类型定义
  在项目的src目录下新建types/vue-router.d.ts文件，添加如下代码扩展RouterLink的属性类型，让TypeScript认可id属性：

  import 'vue-router'
  
  declare module 'vue-router' {
    interface RouterLinkProps {
      id?: string
    }
  }
  

  注意要确保你的tsconfig.json正确包含了这个类型文件的路径。

另外补充：VS Code没提示可能是编辑器类型缓存问题，重启编辑器或执行「Ctrl+Shift+P -> Reload Window」重新加载窗口，应该就能看到对应的类型提示了。

内容的提问来源于stack exchange，提问作者Sam Britt