Generated code references `.js` when it should reference `.ts`

[erikschul]

Describe the bug

Generated code references from "./main_pb.js" when it should reference from "./main_pb.ts"

To Reproduce

proto/main.proto

syntax = "proto3";
package main;

service Greeter {
  rpc SayHello (HelloRequest) returns (HelloReply) {}
}

message HelloRequest {
  string name = 1;
}

message HelloReply {
  string message = 1;
}

buf generate proto/

produces

src/gen/main_connect.ts

// @generated by protoc-gen-connect-es v1.3.0 with parameter "target=ts"
// @generated from file main.proto (package main, syntax proto3)
/* eslint-disable */
// @ts-nocheck

import { HelloReply, HelloRequest } from "./main_pb.js";
...

Environment (please complete the following information):

• @connectrpc/connect-web version: 1.3.0
• @connectrpc/connect-node version:
• Frontend framework and version:
• Node.js version: v18.19.0
• Browser and version:

[Timo Stamm]

Hey Erik, the .js extension in imports looks like a mistake, but it's intentional. See the TypeScript documentation here.

If you need to remove or replace the extension for your environment (Deno, some bundlers), please use the plugin option import_extension.

[erikschul]

Thanks!

Next.js was throwing a compile error Module not found: Can't resolve './main_pb.js'.

Setting import_extension solved it:

version: v1
plugins:
  - plugin: es
    out: src/gen
    opt:
      - target=ts
  - plugin: connect-es
    out: src/gen
    opt:
      - target=ts
      - import_extension=none