@bufbuild/protoc-gen-es

What is @bufbuild/protoc-gen-es?

@bufbuild/protoc-gen-es is an npm package that provides a plugin for the Protocol Buffers compiler (protoc) to generate JavaScript and TypeScript code. It is designed to work with the Buf build system and offers a modern, efficient way to handle Protocol Buffers in JavaScript/TypeScript projects.

What are @bufbuild/protoc-gen-es's main functionalities?

Generate JavaScript Code

This feature allows you to generate JavaScript code from your .proto files using the protoc compiler and the @bufbuild/protoc-gen-es plugin. The generated code can then be used in your JavaScript projects.

```json
{
  "scripts": {
    "generate": "protoc --plugin=protoc-gen-es=./node_modules/.bin/protoc-gen-es --es_out=./src --proto_path=./proto ./proto/*.proto"
  }
}
```

Generate TypeScript Code

This feature allows you to generate TypeScript code from your .proto files. The generated TypeScript code can be used in TypeScript projects, providing type safety and better development experience.

```json
{
  "scripts": {
    "generate": "protoc --plugin=protoc-gen-es=./node_modules/.bin/protoc-gen-es --es_out=import_style=typescript,mode=grpcwebtext:./src --proto_path=./proto ./proto/*.proto"
  }
}
```

Integration with Buf

This feature demonstrates how to integrate @bufbuild/protoc-gen-es with the Buf build system. Buf is a tool that helps manage Protocol Buffers, and using it with @bufbuild/protoc-gen-es simplifies the process of generating JavaScript/TypeScript code.

```json
{
  "scripts": {
    "generate": "buf generate"
  }
}
```

Other packages similar to @bufbuild/protoc-gen-es

protobufjs

protobufjs is a popular library for working with Protocol Buffers in JavaScript. It provides a comprehensive set of tools for parsing, serializing, and deserializing Protocol Buffers. Unlike @bufbuild/protoc-gen-es, protobufjs does not require the protoc compiler and can work directly with .proto files or JSON descriptors.

ts-proto

ts-proto is a TypeScript-first Protocol Buffers generator. It generates idiomatic TypeScript code from .proto files, focusing on providing a seamless TypeScript experience. Compared to @bufbuild/protoc-gen-es, ts-proto is more tightly integrated with TypeScript and offers better type safety and developer experience for TypeScript projects.

grpc-tools

grpc-tools is a package that provides the protoc compiler and gRPC plugins for generating code in various languages, including JavaScript and TypeScript. It is a more general-purpose tool compared to @bufbuild/protoc-gen-es, which is specifically designed for the Buf build system and modern JavaScript/TypeScript development.

README

@bufbuild/protoc-gen-es

A complete implementation of protocol buffers in TypeScript, suitable for web browsers and Node.js.
Learn more at github.com/bufbuild/protobuf-es.

This is a code generator plugin for protoc and buf.

Installation

With npm

npm install @bufbuild/protoc-gen-es

This will install the code generator plugin in node_modules/.bin/protoc-gen-es. Note that npm does not add the executable to your $PATH. You can do so with:

PATH=$PATH:$(pwd)/node_modules/.bin

Note that protoc-gen-es is actually just a simple node script that selects the correct precompiled binary for your platform. For example, if you are on a 32-bit linux machine, the optional dependency @bufbuild/protoc-gen-es-linux-32 is automatically installed by npm, and our node script will run it. Note that this means you cannot move your node_modules directory to a different platform and run it. We recommend you run npm ci in CI or your docker images instead.

With yarn

yarn add @bufbuild/protoc-gen-es

Note that yarn v2 does not use a node_modules directory anymore. To find the path where yarn stores the executable, run yarn bin protoc-gen-es (it is "unplugged" automatically).

Yarn supports installing dependencies for several platforms at the same time, by adding the configuration field supportedArchitectures in your .yarnrc.yml.

With go

Alternatively, you can install the plugin with go:

go install github.com/bufbuild/protobuf-es/cmd/protoc-gen-es@latest

If your go environment is set up correctly, the executable is now available on your $PATH.

You can always confirm successful installation with:

protoc-gen-es --version

Plugin options

target

This option controls whether the plugin generates JavaScript, TypeScript, or TypeScript declaration files.

Possible values:

• target=js - generates a _pb.js file for every .proto input file.
• target=ts - generates a _pb.ts file for every .proto input file.
• target=dts - generates a _pb.d.ts file for every .proto input file.

Multiple values can be given by separating them with +, for example target=js+dts.

By default, we generate JavaScript and TypeScript declaration files, which produces the smallest code size. If you prefer to generate TypeScript, use target=ts.