Losing type information on Client for AppType
I'm getting
output: { [x: string]: any; result?: any; }; on the client but server is showing correct type. I have strict true on the client lib.
2 Replies
Hi @Nxia618,
Please share your relevant code for both the frontend and backend plus your filesystem
server api is in
example
The client library is angular generated via nx with tsconfig (all I've done is add paths)
with one line
hmm, seems to work if I switch out to basic example, so either an issue with @hono/zod-openapi or the rpc routes model
nvm, solved by fixing package.json to do "core": "workspace:" on internal dep
packages/functions/api with functions tsconfig
{
"compilerOptions": {
"strict": true,
"module": "esnext",
"moduleResolution": "node",
"baseUrl": ".",
"allowSyntheticDefaultImports": true,
"esModuleInterop": true
}
{
"compilerOptions": {
"strict": true,
"module": "esnext",
"moduleResolution": "node",
"baseUrl": ".",
"allowSyntheticDefaultImports": true,
"esModuleInterop": true
}
packages/functions/api/index.ts:
import { swaggerUI } from '@hono/swagger-ui'
import { OpenAPIHono } from '@hono/zod-openapi'
import { handle } from 'hono/aws-lambda'
import { compress } from 'hono/compress'
import { logger } from 'hono/logger'
import { appRoute } from './app'
import { concreteRecord } from './concrete-record'
import { mould } from './mould'
import { project } from './project'
import { vehicle } from './vehicle'
const app = new OpenAPIHono()
app.use('*', logger())
app.use('*', compress())
app.use('*', async (c, next) => {
await next()
if (!c.res.headers.get('cache-control')) {
c.header('cache-control', 'no-store, max-age=0, must-revalidate, no-cache')
}
})
app.openAPIRegistry.registerComponent('securitySchemes', 'Bearer', {
type: 'http',
scheme: 'bearer',
})
app.get('/', async (c) => {
return c.json({
message: 'Hello, world!',
})
})
/** Swagger Documentation */
app.doc('/doc', () => ({
openapi: '3.0.0',
info: {
title: 'Extrudakerb API',
version: '0.0.1',
},
}))
// Use the middleware to serve Swagger UI at /ui
app.get(
'/ui',
swaggerUI({
url: '/doc',
}),
)
/** End Swagger Documentation */
export const routes = app
.route('/app', appRoute)
.route('/mould', mould)
.route('/project', project)
.route('/vehicle', vehicle)
.route('/concreteRecord', concreteRecord)
export const handler = handle(app)
import { swaggerUI } from '@hono/swagger-ui'
import { OpenAPIHono } from '@hono/zod-openapi'
import { handle } from 'hono/aws-lambda'
import { compress } from 'hono/compress'
import { logger } from 'hono/logger'
import { appRoute } from './app'
import { concreteRecord } from './concrete-record'
import { mould } from './mould'
import { project } from './project'
import { vehicle } from './vehicle'
const app = new OpenAPIHono()
app.use('*', logger())
app.use('*', compress())
app.use('*', async (c, next) => {
await next()
if (!c.res.headers.get('cache-control')) {
c.header('cache-control', 'no-store, max-age=0, must-revalidate, no-cache')
}
})
app.openAPIRegistry.registerComponent('securitySchemes', 'Bearer', {
type: 'http',
scheme: 'bearer',
})
app.get('/', async (c) => {
return c.json({
message: 'Hello, world!',
})
})
/** Swagger Documentation */
app.doc('/doc', () => ({
openapi: '3.0.0',
info: {
title: 'Extrudakerb API',
version: '0.0.1',
},
}))
// Use the middleware to serve Swagger UI at /ui
app.get(
'/ui',
swaggerUI({
url: '/doc',
}),
)
/** End Swagger Documentation */
export const routes = app
.route('/app', appRoute)
.route('/mould', mould)
.route('/project', project)
.route('/vehicle', vehicle)
.route('/concreteRecord', concreteRecord)
export const handler = handle(app)
{
"compilerOptions": {
"target": "es2022",
"useDefineForClassFields": false,
"forceConsistentCasingInFileNames": true,
"strict": true,
"noImplicitOverride": true,
"noPropertyAccessFromIndexSignature": true,
"noImplicitReturns": true,
"noFallthroughCasesInSwitch": true,
"paths": {
"@functions/*": ["packages/functions/src/*"]
}
},
"files": [],
"include": [],
"references": [
{
"path": "./tsconfig.lib.json"
},
{
"path": "./tsconfig.spec.json"
}
],
"extends": "../../tsconfig.base.json",
"angularCompilerOptions": {
"enableI18nLegacyMessageIdFormat": false,
"strictInjectionParameters": true,
"strictInputAccessModifiers": true,
"strictTemplates": true
}
}
{
"compilerOptions": {
"target": "es2022",
"useDefineForClassFields": false,
"forceConsistentCasingInFileNames": true,
"strict": true,
"noImplicitOverride": true,
"noPropertyAccessFromIndexSignature": true,
"noImplicitReturns": true,
"noFallthroughCasesInSwitch": true,
"paths": {
"@functions/*": ["packages/functions/src/*"]
}
},
"files": [],
"include": [],
"references": [
{
"path": "./tsconfig.lib.json"
},
{
"path": "./tsconfig.spec.json"
}
],
"extends": "../../tsconfig.base.json",
"angularCompilerOptions": {
"enableI18nLegacyMessageIdFormat": false,
"strictInjectionParameters": true,
"strictInputAccessModifiers": true,
"strictTemplates": true
}
}
import type { AppType } from '@functions/api/types'
types.ts
import { routes } from '.'
export type AppType = typeof routes
import { routes } from '.'
export type AppType = typeof routes
import { zValidator } from '@hono/zod-validator'
import { Hono } from 'hono'
import { z } from 'zod'
const app = new Hono()
const route = app.post(
'/posts',
zValidator(
'form',
z.object({
title: z.string(),
body: z.string(),
}),
),
(c) => {
return c.json(
{
ok: true,
message: 'Created!',
},
201,
)
},
)
export type AppType = typeof route
import { zValidator } from '@hono/zod-validator'
import { Hono } from 'hono'
import { z } from 'zod'
const app = new Hono()
const route = app.post(
'/posts',
zValidator(
'form',
z.object({
title: z.string(),
body: z.string(),
}),
),
(c) => {
return c.json(
{
ok: true,
message: 'Created!',
},
201,
)
},
)
export type AppType = typeof route