ServiceType in "@bufbuild/protobuf": "^2.0.0", Conflict Error

[junmingchen123]

`// use-client.ts
import { useMemo } from "react";
import { ServiceType } from "@bufbuild/protobuf";
import { createConnectTransport } from "@connectrpc/connect-web";
import { createPromiseClient, PromiseClient } from "@connectrpc/connect";

// This transport is going to be used throughout the app
const transport = createConnectTransport({
baseUrl: "https://demo.connectrpc.com",
});

/**

• Get a promise client for the given service.
  */
  export function useClient(service: T): PromiseClient {
  // We memoize the client, so that we only create one instance per service.
  return useMemo(() => createPromiseClient(service, transport), [service]);
  }`
  Dear author, I hope you can tell me what to do. Now there is a conflict. Sorry to bother you. The above is the ServiceType used in the official sample code, but when I use version 2.0.0, there is no ServiceType. However, even if I want to lower the version, in the generated api code, there is @bufbuild/protobuf/codegenv1 in the import. If you do not use version 2.0.0 or above, codegenv1 will not have this, and this will report an error. Now, when I use 2.0.0, there is no error. When I try to use the interface, an error is reported again.
  This is Error

`✘ [ERROR] No matching export in "node_modules/@bufbuild/protobuf/dist/esm/index.js" for import "protoBase64"

node_modules/@connectrpc/connect/dist/esm/protocol-connect/error-json.js:25:9:
  25 │ import { protoBase64 } from "@bufbuild/protobuf";
     ╵          ~~~~~~~~~~~

✘ [ERROR] No matching export in "node_modules/@bufbuild/protobuf/dist/esm/index.js" for import "Message"

node_modules/@connectrpc/connect/dist/esm/protocol-connect/handler-factory.js:14:9:
  14 │ import { Message, MethodIdempotency, MethodKind, protoBase64, } from "@bufbuild/protobuf";
     ╵          ~~~~~~~

✘ [ERROR] No matching export in "node_modules/@bufbuild/protobuf/dist/esm/index.js" for import "MethodIdempotency"

node_modules/@connectrpc/connect/dist/esm/protocol-connect/handler-factory.js:14:18:
  14 │ import { Message, MethodIdempotency, MethodKind, protoBase64, } from "@bufbuild/protobuf";
     ╵                   ~~~~~~~~~~~~~~~~~

✘ [ERROR] No matching export in "node_modules/@bufbuild/protobuf/dist/esm/index.js" for import "MethodKind"

node_modules/@connectrpc/connect/dist/esm/protocol-connect/handler-factory.js:14:37:
  14 │ import { Message, MethodIdempotency, MethodKind, protoBase64, } from "@bufbuild/protobuf";
     ╵                                      ~~~~~~~~~~

✘ [ERROR] No matching export in "node_modules/@bufbuild/protobuf/dist/esm/index.js" for import "protoBase64"

node_modules/@connectrpc/connect/dist/esm/protocol-connect/handler-factory.js:14:49:
  14 │ import { Message, MethodIdempotency, MethodKind, protoBase64, } from "@bufbuild/protobuf";`

This is pachakge.json

"@bufbuild/connect": "^0.13.0", "@bufbuild/protobuf": "^2.0.0", "@connectrpc/connect": "^1.4.0", "@connectrpc/connect-web": "^1.4.0",

[timostamm]

Hey @junmingchen123, Connect-ES does not support Protobuf-ES version 2 yet. We will update it shortly.

If you want to give it a try before we cut a stable release, you can use the alpha version:

npm install @connectrpc/connect@alpha @connectrpc/connect-web@alpha @bufbuild/protobuf@latest @bufbuild/protoc-gen-es@latest

[junmingchen123]

Thanks for your reply, but ServiceType is still not available in @bufbuild/protobuf@latest, which is now 2.0.0, and I will replace
import { createPromiseClient, PromiseClient } from "@bufbuild/connect";
with
import { createPromiseClient, PromiseClient } from "@connectrpc/connect";
because there is no ServiceType, so
export function useClient<T extends ServiceType>(service: T): PromiseClient<T> { return useMemo(() => createPromiseClient(service, transport), [service]); }
The T type here reports an error, I tried to use type ServiceType = any; No, I don't know what I should do，The current package.json is：
"@bufbuild/protobuf": "^2.0.0", "@bufbuild/protoc-gen-es": "^2.0.0", "@connectrpc/connect": "^2.0.0-alpha.1", "@connectrpc/connect-web": "^2.0.0-alpha.1",
Then I saw ->PromiseClient
(type parameter) T in useClient<T extends DescService>(service: T): PromiseClient<T>
So, I try
import { DescService } from "@bufbuild/protobuf";
Now it doesn't report an error. It looks like works. Thank you for your reply. If there are still problems, I will continue to leave a message. I wish you a happy life every day.

[kakuiho]

confirm this issue on

    "@bufbuild/protobuf": "^2.2.2",
    "@connectrpc/connect": "^2.0.0",
    "@connectrpc/connect-web": "^2.0.0",

replace import { ServiceType } from "@bufbuild/protobuf";
with import { DescService } from "@bufbuild/protobuf";
walk around this issue and it works, thanks @junmingchen123

please update docs and correct it
https://connectrpc.com/docs/web/using-clients @timostamm

[timostamm]

Ah, we missed to update this example, thanks for the shout.

Updating the docs here: connectrpc/connectrpc.com#227

Related update to MIGRATING.md: connectrpc/connect-es#1343