我有一个使用 Urql 查询 Hasura graphql 端点的 Vue 3 组件。我已经设法使相当简单的查询工作，现在正试图使组件类型安全。
我正在使用 graphql Codegen 来构建类型，它正在生成一个 Types 文件，但是在生成的文件中抛出了错误。
我对 Typescript 有点陌生，所以希望有人能够纠正我。我很想解决生成的 Types 文件中报告的问题。
我提供了以下内容：
- 工作 ListTodos.vue 组件的副本。
- 生成的类型文件 (graphql.d.ts) 的缩写副本。错误发生在第 975 - 989 行，因此我提供了文件的简短版本，仅包含相关行。
- 报告的错误副本
- 我的 codegen.js 配置文件的副本。
任何建议表示赞赏。
1.ListTodos.vue
<script setup lang="ts">
import { useQuery, gql } from '@urql/vue'
const FETCH_TODOS = gql`
query {
todos {
title
user {
name
}
is_public
}
}
`
const result = useQuery({ query: FETCH_TODOS })
</script>
<template>
<div v-if="result.fetching.value">Loading..</div>
<div v-else-if="result.error.value">{{ result.error.value }}</div>
<div v-else>
<ul>
<li v-for="todo of result.data.value.todos">
<h4>{{ todo.title }}</h4>
<p>{{ todo.user.name }}</p>
</li>
</ul>
</div>
</template>
2. Generated Types（略）显示错误下划线
3. 错误
4.codegen.js配置文件
module.exports = {
overwrite: true,
generates: {
'./src/generated/graphql.d.ts': {
schema: [
{
'https://sample-backend-for-hasura-tutorial.hasura.app/v1/graphql': {
headers: {
'x-hasura-role': 'admin',
'x-hasura-admin-secret': 'secret',
},
},
},
],
documents: ['./src/**/*.vue'],
plugins: ['typescript', 'typescript-operations', 'typescript-vue-urql'],
config: {
preResolveTypes: true,
skipTypename: false,
enumsAsTypes: true,
constEnums: true,
},
},
},
}