apollo: demo

codegen.yml

+# This configuration file tells GraphQL Code Generator how
+# to generate types based on our schema.
+schema: "./public/apollo/typeDefs"
+generates:
+  # Specify where our generated types should live.
+  ./typings/__generated__/resolvers-types.ts:
+    plugins:
+      - "typescript"
+      - "typescript-resolvers"
+    config:
+      # useIndexSignature: true
+      # More on this below!
+      # contextType: "../index#MyContext"
\ No newline at end of file

components/ProjectV2.vue

@@ -80,11 +80,28 @@
 <script setup lang="ts">
 import { Socket, io } from 'socket.io-client';
 import { useUserStore } from '~/store/user';
+import { V2 } from '~/typings/__generated__/resolvers-types'
+import gqlV2 from '../graphql/v2.gql'
 
 let tip = ref('')
-let { pending, data: info, execute } = useLazyFetch('/api/devops/v2/getProjectInfo')
+let { pending, data: info, execute } = useAsyncData(() => {
+  return $fetch<{ data: { v2: V2 } }>('/graphql', {
+    method: 'post',
+    body: {
+      query: gqlV2,
+      variables: {
+        username: useUserStore().username
+      }
+    }
+  }).then(value => {
+    return value.data.v2
+  })
+}, {
+  lazy: true
+})
 
 watch(info, (info) => {
+  console.log('info', info)
   useUserStore().setBranchV2({ branchV2: info?.branch || '' })
   if (info && info.status) {
     tip.value = getTip(info.status) || ''
@@ -111,7 +128,7 @@ function handleOpenVscode() {
   window.open(window.location.protocol + '//' + window.location.hostname + ':' + useUserStore().port + '/vscode?folder=/var/logwire-backend', '_blank')
 }
 
-function getStatusLabel(status?: string) {
+function getStatusLabel(status?: string | null) {
   const map = new Map([
     ['null', "未初始化"],
     ['creating', '创建中'],
@@ -144,11 +161,11 @@ async function handleInstall() {
   execute()
 }
 async function handleTest () {
-  await $fetch('/graphql', {
+  await $fetch<V2>('/graphql', {
     method: 'post',
     body: {
       query: `{
-        v2(username: "wyq"){
+        v2(username: "wyq222"){
           username,
           tenants {
             id

graphql/v2.gql

+query V2 ($username: String) {
+  v2(username: $username){
+    username,
+    status,
+    branch
+  }
+}
\ No newline at end of file

nuxt.config.ts

@@ -9,6 +9,13 @@ export default defineNuxtConfig({
       websocket: true
     }
   },
+  typescript: {
+    tsConfig: {
+      compilerOptions: {
+        verbatimModuleSyntax: false
+      }
+    }
+  },
   runtimeConfig: {
     pgUser: '',
     pgPort: '',

package.json

@@ -3,6 +3,7 @@
   "private": true,
   "type": "module",
   "scripts": {
+    "codegen": "graphql-codegen --config codegen.yml",
     "build": "nuxt build",
     "dev": "nuxt dev",
     "generate": "nuxt generate",
@@ -27,6 +28,9 @@
     "vue-router": "^4.3.0"
   },
   "devDependencies": {
+    "@graphql-codegen/cli": "^5.0.2",
+    "@graphql-codegen/typescript": "^4.0.9",
+    "@graphql-codegen/typescript-resolvers": "^4.2.1",
     "@types/dockerode": "^3.3.28",
     "@types/lodash": "^4.17.0",
     "@types/pg": "^8.11.4",

public/apollo/resolvers/query.ts

-export default {
+import type { Resolvers } from "~/typings/__generated__/resolvers-types"
+
+export const resolvers: Resolvers = {
   Query: {
     user: async (parent: any, args: Record<string, any>, contextValue: Record<string, any>, info: Record<string, any>) => {
       return await getPgTableData('user', args.username)

public/apollo/typeDefs/query.graphql

@@ -3,3 +3,42 @@ type Query {
   v2(username: String): V2
   v1(username: String): V1
 }
+
+type User {
+  username: String
+  port: Int
+}
+
+type V1 {
+  username: String
+  branch: String
+  status: String
+  serverProperties: [ServerProperty!]
+}
+
+type V2 {
+  username: String
+  tenants: Tenant
+  branch: String
+  debug: Debug
+  has_debugged: Boolean
+  status: String
+  serverProperties: [ServerProperty!]
+}
+
+type Tenant {
+  id: String
+  host: String
+  databaseschema: String
+  primarynamespace: String
+}
+
+type Debug {
+  host: String
+}
+
+type ServerProperty {
+  id: Float
+  key: String
+  value: String
+}

public/apollo/typeDefs/user.graphql

-type User {
-  username: String
-  port: Int
-}
\ No newline at end of file

public/apollo/typeDefs/v1.graphql

-type V1 {
-  username: String
-  status: String
-  serverProperties: [ServerProperty]!
-}
\ No newline at end of file

public/apollo/typeDefs/v2.graphql

-type V2 {
-  username: String
-  tenants: Tenant
-  debug: Debug
-  has_debugged: Boolean
-  status: String
-  serverProperties: [ServerProperty]!
-}
-
-type Tenant {
-  id: String
-  host: String
-  databaseschema: String
-  primarynamespace: String
-}
-
-type Debug {
-  host: String
-}
-
-type ServerProperty {
-  id: Float
-  key: String
-  value: String
-}
\ No newline at end of file

server/api/devops/v1/getProjectInfo.get.ts

-import { TableV1, TableV2 } from "~/server/utils/postgres"
+import { V1 as TableV1 } from "~/typings/__generated__/resolvers-types"
 
 export default defineEventHandler(async (event) => {
   let username = event.context.username

server/api/devops/v2/getProjectInfo.get.ts

-import { TableV2 } from "~/server/utils/postgres"
+import { V2 as TableV2 } from "~/typings/__generated__/resolvers-types"
 
 export default defineEventHandler(async (event) => {
   let username = event.context.username

server/api/git/checkout.post.ts

@@ -23,6 +23,7 @@ export default defineEventHandler(async (event) => {
         }
         await docker.execContainerCommand({ container, cmd: 'git checkout ' + branch, dir })
       }
+      setPgTableData(body.platform, username, 'branch', branch)
     } else {
       throw new Error('没有创建容器，请先初始化容器')
     }

server/api/user/login.post.ts

-import { TableUser } from "~/server/utils/postgres"
 import { SESSION_PASSWORD } from "../../utils"
 
 export default defineEventHandler(async (event) => {

server/plugins/apollo.server.ts

 import type { NitroApp } from "nitropack";
-import { ApolloServer, ContextFunction, HeaderMap } from '@apollo/server'
+import { ApolloServer, BaseContext, ContextFunction, HeaderMap } from '@apollo/server'
 import { startStandaloneServer } from "@apollo/server/standalone";
-import Resolvers from '../../public/apollo/resolvers/query'
+import { resolvers } from '../../public/apollo/resolvers/query'
 import fs from 'fs'
 
 function readGraphqlString (filename: string) {
@@ -10,18 +10,9 @@ function readGraphqlString (filename: string) {
 }
 
 export default defineNitroPlugin((nitroApp: NitroApp) => {
-  const resolvers = Resolvers
   const query = readGraphqlString('query')
-  const user = readGraphqlString('user')
-  const v2 = readGraphqlString('v2')
-  const v1 = readGraphqlString('v1')
-  const typeDefs = `
-  ${query}
-  ${user}
-  ${v2}
-  ${v1}
-  `
-  const server = new ApolloServer({
+  const typeDefs = query
+  const server = new ApolloServer<BaseContext>({
     typeDefs,
     resolvers,
     csrfPrevention: false

server/utils/postgres.ts

 import pg from 'pg'
 import { sendProjectStatus } from './log'
+import { User as TableUser, V2 as TableV2, V1 as TableV1 } from '~/typings/__generated__/resolvers-types'
 
 const config = useRuntimeConfig()
 
@@ -42,26 +43,9 @@ export function stopPgClient (pgClient: pg.Client) {
   return pgClient.end()
 }
 
-export type TableUser = { username: string, port: number }
-
-export type TableV2 = {
-  username: string
-  status: 'null' | 'created' | 'running' | 'launched' | 'debug-launched' | 'creating' | 'compiling' | 'compiled'
-  tenants: Record<string, any>
-  debug: Record<string, any>
-  has_debugged: boolean
-  serverProperties: { id: any, key: string, value: string }[]
-}
-
-export type TableV1 = {
-  username: string
-  status:  'null' | 'created' | 'running' | 'launched'  | 'creating' | 'compiling' | 'compiled'
-  serverProperties: { id: any, key: string, value: string }[]
-}
-
-export async function getPgTableData (table: 'v1', username: string): Promise<TableV1 | undefined>;
-export async function getPgTableData (table: 'v2', username: string): Promise<TableV2 | undefined>;
-export async function getPgTableData (table: 'user', username: string): Promise<TableUser | undefined>;
+export async function getPgTableData (table: 'v1', username: string): Promise<TableV1>;
+export async function getPgTableData (table: 'v2', username: string): Promise<TableV2>;
+export async function getPgTableData (table: 'user', username: string): Promise<TableUser>;
 export async function getPgTableData (table: string, username: string) {
   const result = await pool.query(`select * from public.${table} where username = '${username}'`)
   return result.rows[0]

typings/__generated__/resolvers-types.ts

+import { GraphQLResolveInfo } from 'graphql';
+export type Maybe<T> = T | null;
+export type InputMaybe<T> = Maybe<T>;
+export type Exact<T extends { [key: string]: unknown }> = { [K in keyof T]: T[K] };
+export type MakeOptional<T, K extends keyof T> = Omit<T, K> & { [SubKey in K]?: Maybe<T[SubKey]> };
+export type MakeMaybe<T, K extends keyof T> = Omit<T, K> & { [SubKey in K]: Maybe<T[SubKey]> };
+export type MakeEmpty<T extends { [key: string]: unknown }, K extends keyof T> = { [_ in K]?: never };
+export type Incremental<T> = T | { [P in keyof T]?: P extends ' $fragmentName' | '__typename' ? T[P] : never };
+/** All built-in and custom scalars, mapped to their actual values */
+export type Scalars = {
+  ID: { input: string; output: string; }
+  String: { input: string; output: string; }
+  Boolean: { input: boolean; output: boolean; }
+  Int: { input: number; output: number; }
+  Float: { input: number; output: number; }
+};
+
+export type Debug = {
+  __typename?: 'Debug';
+  host?: Maybe<Scalars['String']['output']>;
+};
+
+export type Query = {
+  __typename?: 'Query';
+  user?: Maybe<User>;
+  v1?: Maybe<V1>;
+  v2?: Maybe<V2>;
+};
+
+
+export type QueryUserArgs = {
+  username?: InputMaybe<Scalars['String']['input']>;
+};
+
+
+export type QueryV1Args = {
+  username?: InputMaybe<Scalars['String']['input']>;
+};
+
+
+export type QueryV2Args = {
+  username?: InputMaybe<Scalars['String']['input']>;
+};
+
+export type ServerProperty = {
+  __typename?: 'ServerProperty';
+  id?: Maybe<Scalars['Float']['output']>;
+  key?: Maybe<Scalars['String']['output']>;
+  value?: Maybe<Scalars['String']['output']>;
+};
+
+export type Tenant = {
+  __typename?: 'Tenant';
+  databaseschema?: Maybe<Scalars['String']['output']>;
+  host?: Maybe<Scalars['String']['output']>;
+  id?: Maybe<Scalars['String']['output']>;
+  primarynamespace?: Maybe<Scalars['String']['output']>;
+};
+
+export type User = {
+  __typename?: 'User';
+  port?: Maybe<Scalars['Int']['output']>;
+  username?: Maybe<Scalars['String']['output']>;
+};
+
+export type V1 = {
+  __typename?: 'V1';
+  branch?: Maybe<Scalars['String']['output']>;
+  serverProperties?: Maybe<Array<ServerProperty>>;
+  status?: Maybe<Scalars['String']['output']>;
+  username?: Maybe<Scalars['String']['output']>;
+};
+
+export type V2 = {
+  __typename?: 'V2';
+  branch?: Maybe<Scalars['String']['output']>;
+  debug?: Maybe<Debug>;
+  has_debugged?: Maybe<Scalars['Boolean']['output']>;
+  serverProperties?: Maybe<Array<ServerProperty>>;
+  status?: Maybe<Scalars['String']['output']>;
+  tenants?: Maybe<Tenant>;
+  username?: Maybe<Scalars['String']['output']>;
+};
+
+
+
+export type ResolverTypeWrapper<T> = Promise<T> | T;
+
+
+export type ResolverWithResolve<TResult, TParent, TContext, TArgs> = {
+  resolve: ResolverFn<TResult, TParent, TContext, TArgs>;
+};
+export type Resolver<TResult, TParent = {}, TContext = {}, TArgs = {}> = ResolverFn<TResult, TParent, TContext, TArgs> | ResolverWithResolve<TResult, TParent, TContext, TArgs>;
+
+export type ResolverFn<TResult, TParent, TContext, TArgs> = (
+  parent: TParent,
+  args: TArgs,
+  context: TContext,
+  info: GraphQLResolveInfo
+) => Promise<TResult> | TResult;
+
+export type SubscriptionSubscribeFn<TResult, TParent, TContext, TArgs> = (
+  parent: TParent,
+  args: TArgs,
+  context: TContext,
+  info: GraphQLResolveInfo
+) => AsyncIterable<TResult> | Promise<AsyncIterable<TResult>>;
+
+export type SubscriptionResolveFn<TResult, TParent, TContext, TArgs> = (
+  parent: TParent,
+  args: TArgs,
+  context: TContext,
+  info: GraphQLResolveInfo
+) => TResult | Promise<TResult>;
+
+export interface SubscriptionSubscriberObject<TResult, TKey extends string, TParent, TContext, TArgs> {
+  subscribe: SubscriptionSubscribeFn<{ [key in TKey]: TResult }, TParent, TContext, TArgs>;
+  resolve?: SubscriptionResolveFn<TResult, { [key in TKey]: TResult }, TContext, TArgs>;
+}
+
+export interface SubscriptionResolverObject<TResult, TParent, TContext, TArgs> {
+  subscribe: SubscriptionSubscribeFn<any, TParent, TContext, TArgs>;
+  resolve: SubscriptionResolveFn<TResult, any, TContext, TArgs>;
+}
+
+export type SubscriptionObject<TResult, TKey extends string, TParent, TContext, TArgs> =
+  | SubscriptionSubscriberObject<TResult, TKey, TParent, TContext, TArgs>
+  | SubscriptionResolverObject<TResult, TParent, TContext, TArgs>;
+
+export type SubscriptionResolver<TResult, TKey extends string, TParent = {}, TContext = {}, TArgs = {}> =
+  | ((...args: any[]) => SubscriptionObject<TResult, TKey, TParent, TContext, TArgs>)
+  | SubscriptionObject<TResult, TKey, TParent, TContext, TArgs>;
+
+export type TypeResolveFn<TTypes, TParent = {}, TContext = {}> = (
+  parent: TParent,
+  context: TContext,
+  info: GraphQLResolveInfo
+) => Maybe<TTypes> | Promise<Maybe<TTypes>>;
+
+export type IsTypeOfResolverFn<T = {}, TContext = {}> = (obj: T, context: TContext, info: GraphQLResolveInfo) => boolean | Promise<boolean>;
+
+export type NextResolverFn<T> = () => Promise<T>;
+
+export type DirectiveResolverFn<TResult = {}, TParent = {}, TContext = {}, TArgs = {}> = (
+  next: NextResolverFn<TResult>,
+  parent: TParent,
+  args: TArgs,
+  context: TContext,
+  info: GraphQLResolveInfo
+) => TResult | Promise<TResult>;
+
+
+
+/** Mapping between all available schema types and the resolvers types */
+export type ResolversTypes = {
+  Boolean: ResolverTypeWrapper<Scalars['Boolean']['output']>;
+  Debug: ResolverTypeWrapper<Debug>;
+  Float: ResolverTypeWrapper<Scalars['Float']['output']>;
+  Int: ResolverTypeWrapper<Scalars['Int']['output']>;
+  Query: ResolverTypeWrapper<{}>;
+  ServerProperty: ResolverTypeWrapper<ServerProperty>;
+  String: ResolverTypeWrapper<Scalars['String']['output']>;
+  Tenant: ResolverTypeWrapper<Tenant>;
+  User: ResolverTypeWrapper<User>;
+  V1: ResolverTypeWrapper<V1>;
+  V2: ResolverTypeWrapper<V2>;
+};
+
+/** Mapping between all available schema types and the resolvers parents */
+export type ResolversParentTypes = {
+  Boolean: Scalars['Boolean']['output'];
+  Debug: Debug;
+  Float: Scalars['Float']['output'];
+  Int: Scalars['Int']['output'];
+  Query: {};
+  ServerProperty: ServerProperty;
+  String: Scalars['String']['output'];
+  Tenant: Tenant;
+  User: User;
+  V1: V1;
+  V2: V2;
+};
+
+export type DebugResolvers<ContextType = any, ParentType extends ResolversParentTypes['Debug'] = ResolversParentTypes['Debug']> = {
+  host?: Resolver<Maybe<ResolversTypes['String']>, ParentType, ContextType>;
+  __isTypeOf?: IsTypeOfResolverFn<ParentType, ContextType>;
+};
+
+export type QueryResolvers<ContextType = any, ParentType extends ResolversParentTypes['Query'] = ResolversParentTypes['Query']> = {
+  user?: Resolver<Maybe<ResolversTypes['User']>, ParentType, ContextType, Partial<QueryUserArgs>>;
+  v1?: Resolver<Maybe<ResolversTypes['V1']>, ParentType, ContextType, Partial<QueryV1Args>>;
+  v2?: Resolver<Maybe<ResolversTypes['V2']>, ParentType, ContextType, Partial<QueryV2Args>>;
+};
+
+export type ServerPropertyResolvers<ContextType = any, ParentType extends ResolversParentTypes['ServerProperty'] = ResolversParentTypes['ServerProperty']> = {
+  id?: Resolver<Maybe<ResolversTypes['Float']>, ParentType, ContextType>;
+  key?: Resolver<Maybe<ResolversTypes['String']>, ParentType, ContextType>;
+  value?: Resolver<Maybe<ResolversTypes['String']>, ParentType, ContextType>;
+  __isTypeOf?: IsTypeOfResolverFn<ParentType, ContextType>;
+};
+
+export type TenantResolvers<ContextType = any, ParentType extends ResolversParentTypes['Tenant'] = ResolversParentTypes['Tenant']> = {
+  databaseschema?: Resolver<Maybe<ResolversTypes['String']>, ParentType, ContextType>;
+  host?: Resolver<Maybe<ResolversTypes['String']>, ParentType, ContextType>;
+  id?: Resolver<Maybe<ResolversTypes['String']>, ParentType, ContextType>;
+  primarynamespace?: Resolver<Maybe<ResolversTypes['String']>, ParentType, ContextType>;
+  __isTypeOf?: IsTypeOfResolverFn<ParentType, ContextType>;
+};
+
+export type UserResolvers<ContextType = any, ParentType extends ResolversParentTypes['User'] = ResolversParentTypes['User']> = {
+  port?: Resolver<Maybe<ResolversTypes['Int']>, ParentType, ContextType>;
+  username?: Resolver<Maybe<ResolversTypes['String']>, ParentType, ContextType>;
+  __isTypeOf?: IsTypeOfResolverFn<ParentType, ContextType>;
+};
+
+export type V1Resolvers<ContextType = any, ParentType extends ResolversParentTypes['V1'] = ResolversParentTypes['V1']> = {
+  branch?: Resolver<Maybe<ResolversTypes['String']>, ParentType, ContextType>;
+  serverProperties?: Resolver<Maybe<Array<ResolversTypes['ServerProperty']>>, ParentType, ContextType>;
+  status?: Resolver<Maybe<ResolversTypes['String']>, ParentType, ContextType>;
+  username?: Resolver<Maybe<ResolversTypes['String']>, ParentType, ContextType>;
+  __isTypeOf?: IsTypeOfResolverFn<ParentType, ContextType>;
+};
+
+export type V2Resolvers<ContextType = any, ParentType extends ResolversParentTypes['V2'] = ResolversParentTypes['V2']> = {
+  branch?: Resolver<Maybe<ResolversTypes['String']>, ParentType, ContextType>;
+  debug?: Resolver<Maybe<ResolversTypes['Debug']>, ParentType, ContextType>;
+  has_debugged?: Resolver<Maybe<ResolversTypes['Boolean']>, ParentType, ContextType>;
+  serverProperties?: Resolver<Maybe<Array<ResolversTypes['ServerProperty']>>, ParentType, ContextType>;
+  status?: Resolver<Maybe<ResolversTypes['String']>, ParentType, ContextType>;
+  tenants?: Resolver<Maybe<ResolversTypes['Tenant']>, ParentType, ContextType>;
+  username?: Resolver<Maybe<ResolversTypes['String']>, ParentType, ContextType>;
+  __isTypeOf?: IsTypeOfResolverFn<ParentType, ContextType>;
+};
+
+export type Resolvers<ContextType = any> = {
+  Debug?: DebugResolvers<ContextType>;
+  Query?: QueryResolvers<ContextType>;
+  ServerProperty?: ServerPropertyResolvers<ContextType>;
+  Tenant?: TenantResolvers<ContextType>;
+  User?: UserResolvers<ContextType>;
+  V1?: V1Resolvers<ContextType>;
+  V2?: V2Resolvers<ContextType>;
+};
+

vite-env-override.d.ts

+declare module '*.gql' {
+  const gql: string
+  export default gql
+}
\ No newline at end of file