Possible regression in 1.16 Typescript client generation

[IkeOTL]

What are you generating using Kiota, clients or plugins?

API Client/SDK

In what context or format are you using Kiota?

Nuget tool

Client library/SDK language

TypeScript

Describe the bug

in 1.16 of the dotnet tool the clients are generating like this:

import { AnalyticsRequestBuilderNavigationMetadata, type AnalyticsRequestBuilder } from './analytics/index.js';
// @ts-ignore
import { HealthRequestBuilderRequestsMetadata, type HealthRequestBuilder } from './health/index.js';

in 1.15 they were generated like this:

import { AnalyticsRequestBuilderNavigationMetadata, type AnalyticsRequestBuilder } from './analytics/';
// @ts-ignore
import { HealthRequestBuilderRequestsMetadata, type HealthRequestBuilder } from './health/';

Expected behavior

should generate like this:

import { AnalyticsRequestBuilderNavigationMetadata, type AnalyticsRequestBuilder } from './analytics/';
// @ts-ignore
import { HealthRequestBuilderRequestsMetadata, type HealthRequestBuilder } from './health/';

How to reproduce

update to dotnet tool version 1.16

execute: dotnet kiota generate -d ${swaggerUrl} --language typescript --class-name ${serviceLabel}ServiceClient --exclude-backward-compatible --output ./generated-clients/${serviceName}

Open API description file

No response

Kiota Version

1.16.0+f7ce8b88eefa1c00cb6f87dd48335baac96d2cc9

Latest Kiota version known to work for scenario above?(Not required)

No response

Known Workarounds

downgrade to 1.15

Configuration

No response

Debug output

Click to expand log

``` ```

Other information

No response

[baywet]

Hi @IkeOTL , Thanks for using kiota and for reaching out. This is intentional, we've moved to generating es6 imports in #4815

You might need to update your project configuration. Let us know if you have further questions.

[IkeOTL]

In my case, in my web app I have a generated-client dir where I execute a script that simply executes kiota generate on all my target APIs, and in my web app's tsconfig the path option has the generated dir. However, my app no longer works since index.js is not found. The Kiota tool generates index.ts

Is there an option to make it generate index.js or am I misunderstanding an implicit behavior?

[baywet]

can you share your tsconfig? and what's the type set to in the package.json?

[IkeOTL]

My package.json for my webapp:

{
  "name": "admin-app",
  "version": "0.1.0",
  "private": true,
  "scripts": {
    "dev": "next dev",
    "build": "next build",
    "start": "next start"
  },
  "dependencies": {
    ...
    "@microsoft/kiota-abstractions": "^1.0.0-preview.57",
    "@microsoft/kiota-http-fetchlibrary": "^1.0.0-preview.56",
    "@microsoft/kiota-serialization-form": "^1.0.0-preview.46",
    "@microsoft/kiota-serialization-json": "^1.0.0-preview.57",
    "@microsoft/kiota-serialization-multipart": "^1.0.0-preview.35",
    "@microsoft/kiota-serialization-text": "^1.0.0-preview.54",
    ...
  },
  "devDependencies": {
    ...
  }
}

tsconfig.json for my webapp:

{
  "compilerOptions": {
    "target": "es5",
    "lib": ["dom", "dom.iterable", "esnext"],
    "allowJs": true,
    "skipLibCheck": true,
    "strict": true,
    "noEmit": true,
    "esModuleInterop": true,
    "module": "esnext",
    "moduleResolution": "bundler",
    "resolveJsonModule": true,
    "isolatedModules": true,
    "jsx": "preserve",
    "incremental": true,
    "plugins": [
      {
        "name": "next"
      }
    ],
    "paths": {
      "@/*": ["./src/*"],
      "@/api-clients/*": ["./clients/generated-clients/*"]
    }
  },
  "include": ["next-env.d.ts", "**/*.js", "**/*.ts", "**/*.tsx", ".next/types/**/*.ts"],
  "exclude": ["node_modules"]
}

Clients are used raw from kiota generate output to ./clients/generated-clients/{client-name}

Should i be updating the target to es6?

[IkeOTL]

Yes, setting it to es6 worked. Sorry about that, learned something new today.

[baywet]

thanks for confirming!

[IkeOTL]

It seems that I was mistaken... The project will not build, but VSCode can traverse the imports, so it seems I'm missing another piece.

where my kiota generated client looks like this:

and the audio/ looks like this:

[baywet]

Can you try updating your project configuration to this https://learn.microsoft.com/en-us/openapi/kiota/quickstarts/typescript#project-configuration

And set type module in your package JSON. Please?

[IkeOTL]

I tried earlier here are the results. I breaks my current Next.js project, as in non-Kiota client imports:

tsconfig.json

package.json

Interesting note, if i add .js to the end of my imports VSCode stops complaining:

However, build still fails:

[baywet]

I am not very familiar with nextJS build pipeline. My guess is es modules are not enabled in the build configuration for your project and this is why it does not recognize imports with a JS extension. Next JS itself seems to support es modules, so make sure you have the latest version and good luck with the configuration investigation. https://www.codeconcisely.com/posts/nextjs-esm/

[IkeOTL]

Alright, thanks for your time!