Creating a TypeScript client using NSwag with named properties: A step-by-step guide

Our TypeScript client is created from a swagger interface using NSwag.

The resulting client code typically looks like this:

client.EndPointFoo(arg1, arg2, arg3, ...)

However, we encounter issues when NSwag changes the order of arguments in response to modifications in the Swagger interface. Sometimes, the compiler fails to catch these problems, especially when the parameters are of the same type, leading to runtime errors.

I am interested in generating the client with named properties instead, like so:

client.EndPointFoo(
    property1: arg1,
    property2: arg2,
    property3: arg3,
    ...)

Is there a way to achieve this without creating a custom Liquid template? Or should I create my own template for this purpose?

Answer №1

Full disclosure: I am one of the maintainers of Fern

Hi @tomas, why not try out Fern's TypeScript generator? It can create named properties for your requests, making it easier to catch any compile errors when your API changes.

Check out our guides on how to import an existing OpenAPI .

npm install -g fern-api
fern init --openapi <path to openapi|url>
fern generate

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Tips for integrating a custom handler to the close icon in Material UI TextField component

In my Reactjs/Typescript project using Material UI, I have a search input component rendered with TextField. The built-in "x" icon clears the input value, but I want to create a custom handler for making an API call when the search value is deleted. I&apo ...

What is the necessity of requiring a parameter with the type "any"?

There is a function in my code that takes a single parameter of type any: function doSomething(param: any) { // Code to handle the param } When I call this function without passing any arguments: doSomething(); An error is thrown saying: "Expected 1 ...

What is the method for ensuring TypeScript automatically detects the existence of a property when an object is statically defined?

In my software, I have an interface that serves as a base for other types. To simplify things for this discussion, let's focus on one specific aspect. This interface includes an optional method called getColor. I am creating an object that implements ...

A Unique Identifier in Kotlin

In my typescript class, I have a member that accepts any as the name: interface ControlTagType { type?: String | null; [name: string]: any } class ControlTag { tagSource: String | null = null; tag: ControlTagType | null = null; } expor ...

Ensuring the correct type of keys during Object.entries iteration in TypeScript

When using Object.entries(), it returns the correct value types, but the keys are of type string[], which is incorrect. I want TypeScript to recognize my keys correctly. I attempted to use as const on the object, but it did not have any effect. Is there a ...

How can I implement a master-detail view in Angular 2?

Update: I finally figured it out. After moving all the html from index.html to app.component.ts, everything started working perfectly. The method described below is the correct one. I've been facing an issue where I have a ParentComponent that retrie ...

Setting a callback function as a prop for react-paginate in TypeScript: A step-by-step guide

When using react-paginate, there is a prop called onPageChange with the following type: onPageChange?(selectedItem: { selected: number }): void; After implementing it like this: const onPageChange = (selected): void => { console.log(selected); } ...

Creating a personalized aggregation function in a MySQL query

Presenting the data in tabular format: id | module_id | rating 1 | 421 | 3 2 | 421 | 5 3. | 5321 | 4 4 | 5321 | 5 5 | 5321 | 4 6 | 641 | 2 7 | ...

Execute a function once an observable variable has been successfully initialized

I'm currently putting together a chat application using socket.io in Angular. I've encountered an issue where I can't seem to execute a particular code or function right after an observable variable is initialized through subscription. The i ...

How to implement an Angular Animation that is customizable with an @Input() parameter?

Have you ever wondered if it's possible to integrate custom parameters into an Angular animation by passing them through a function, and then proceed to use the resulting animation in a component? To exemplify this concept, consider this demo where t ...

Incorporating TypeScript seamlessly into your current Create React App project without the need to modify any existing code or files

While I have already installed Typescript in my project, I am more concerned about adding new .tsx files and ensuring they are type-checked. Simply renaming existing .js files to .tsx is not a viable solution, as it requires refactoring all the existing ...

Determining the type of a single deconstructed variable from an object

My useForm hook is designed to take an object and return several useful functions back, including that object as a state. However, due to TypeScript limitations, the specific type from the initial object cannot be returned because useForm accepts dynamic o ...

Styling Form validation with Ant Design

Can a className prop be included in the Form.Item validation? <Form.Item name="username" rules={[ { required: true, message: '...' }, className="customValidation" //<- attempting to add a className but it is not fu ...

Why won't my fetch API function properly in my Next.js project?

import { GetServerSideProps } from 'next'; type Product = { //Product variables id: number; title: string; price: number; thumbnail: string; }; interface ProductsProps { products: Product[]; } export default function Products({ produ ...

"Protractor encountered an issue when navigating to the most up-to-date Angular section in our

We are in the process of upgrading our application from AngularJS to the latest version of Angular. I am currently working on writing tests that transition from the AngularJS version of the app to the admin application, which is built using the latest ver ...

An issue arises when utilizing a string variable in React-bootstrap's OverlayTrigger placement attribute

I encountered an unexpected issue with the OverlayTrigger component in React-Bootstrap version 5.1.1. I'm attempting to develop a custom button component using OverlayTrigger and a standard button. Everything is functioning as intended, except for whe ...

Error message: "The function app.functions is not a valid function in Angular Fire Functions

Currently, I am utilizing Angular v16 alongside Angular Fire v16 and Firebase v9. Following the instructions, I completed all the necessary setup steps including executing firebase login, firebase init, and converting the functions to typescript. Next, wi ...

Include a Custom Button with an Optional Event Handler

I've created a customized material-ui button component: type ButtonProps = { disabled: boolean; text: string }; export function CustomButton({ disabled, text }: ButtonProps) { return ( <Button type="submit" disabled={disabled} ...

What steps are required to generate dist/app.js from a script file in my TypeScript project?

I am currently working on a project using node, express, and TypeScript. When I run npm run build, everything builds without any issues. However, when I attempt to run npm run start, I encounter the following error: @ruler-mobility/[email protected] /User ...

Error encountered while attempting to globally install TypeScript using npm: "npm ERR! code -13"

Issue with npm error 13 Having trouble installing typescript-g package Error details: - errno: -13, - npm ERR! code: 'EACCES', - npm ERR! syscall: 'symlink', - npm ERR! path: '../lib/node_modules/typescript/bin/tsc', ...