Registry / devops / grpc-webpack-plugin

grpc-webpack-plugin

library0.2.79jsnpmunverified

A webpack plugin that automatically compiles .proto files with gRPC-Web and protoc during build. Version 0.2.79 is the latest stable release, with recent updates focused on bug fixes. It supports multiple output types (JavaScript, gRPC-Web client stubs), import styles (closure, commonjs, commonjs+dts, typescript), and wire format modes (grpcwebtext, grpcweb). Key differentiators: build-time proto compilation eliminates manual protoc invocations; file watching for .proto changes; synchronization with source .proto files. Requires node >=10.12.0 and peer dependencies grpc-web ^1.0.0 and webpack ^4.0.0.

devops

npm install grpc-webpack-plugin

github ↗package ↗homepage ↗

INSTALL

IMPORT

SIG · GRPC-WEBPACK-PLUGI

grpc-webpack-plugin

devopsjavascriptv0.2.79

harness data pending

Install & Compatibility

Where this runs

No compatibility data collected yet for this library.

Code

Verified usage

Verified import paths — ran on the pinned version, not inferred.

GrpcWebPlugin

✓ const GrpcWebPlugin = require('grpc-webpack-plugin');

✗ import GrpcWebPlugin from 'grpc-webpack-plugin';

Package is CommonJS only; ESM import may fail or require bundler transformation.

GrpcWebPlugin (ESM)

✓ import GrpcWebPlugin from 'grpc-webpack-plugin';

✗ const GrpcWebPlugin = require('grpc-webpack-plugin').default;

Some bundlers allow ESM import, but the package has no default export; the require style is safer.

GrpcWebPlugin (TypeScript)

✓ import GrpcWebPlugin = require('grpc-webpack-plugin');

✗ import { GrpcWebPlugin } from 'grpc-webpack-plugin';

TypeScript users should use `import = require()` or esModuleInterop to match CommonJS.

GrpcWebPlugin (destructuring)

✓ const { GrpcWebPlugin } = require('grpc-webpack-plugin');

✗ import { GrpcWebPlugin } from 'grpc-webpack-plugin';

Destructuring require works, but named import in ESM might resolve to undefined.

Configures webpack to compile .proto files during build: first generates pure JS message classes, then generates gRPC-Web client stubs with TypeScript definitions.

// webpack.config.js const GrpcWebPlugin = require('grpc-webpack-plugin'); const path = require('path'); const PROTO_DIR = path.resolve(__dirname, './protos'); const OUT_DIR = path.resolve(__dirname, './generated'); module.exports = { mode: 'development', plugins: [ new GrpcWebPlugin({ protoPath: PROTO_DIR, protoFiles: ['my_service.proto'], outputType: 'js', importStyle: 'commonjs', binary: true, outDir: OUT_DIR, }), new GrpcWebPlugin({ protoPath: PROTO_DIR, protoFiles: ['my_service.proto'], outputType: 'grpc-web', importStyle: 'commonjs+dts', mode: 'grpcwebtext', outDir: OUT_DIR, }), ], };

Debug

Known issues

gotchaRequires protoc and protoc-gen-grpc-web binaries installed on the system; missing them results in silent failures or build errors.

fix

Install protoc from https://github.com/protocolbuffers/protobuf/releases and protoc-gen-grpc-web from https://github.com/grpc/grpc-web/releases, ensuring they are in PATH.

affects: >=0.2.78

breakingVersions before 0.2.78 used a different option format and did not support the 'mode' option.

fix

Upgrade to >=0.2.78 and update configuration to use 'mode' property instead of previous deprecated behavior.

affects: <0.2.78

deprecatedWebpack 4 is the only supported version; webpack 5 compatibility is not verified.

fix

If using webpack 5, consider alternative plugins or test compatibility; maintain webpack 4 if using this plugin.

affects: >=0.2.78

gotchaThe 'watch' option only works if 'synchronize' is true; watch mode must also be enabled via webpack's watch option.

fix

Set synchronize: true and webpack watch: true (or use webpack-dev-server with watch enabled).

affects: >=0.2.78

gotchaNotable community fork or alternatives exist (e.g., protoc-gen-ts, buf build) with different trade-offs; no known security incidents.

fix

Evaluate alternatives if file watching or webpack 5 support is critical.

affects: >=0.2.78

Errors

Common errors & fixes

Error: Cannot find module 'grpc-webpack-plugin'

Plugin not installed or not listed in devDependencies.

fix

Run 'npm install --save-dev grpc-webpack-plugin' or 'yarn add --dev grpc-webpack-plugin'.

Error: 'protoc' command not found

protoc binary is not installed or not in PATH.

fix

Install protoc from https://github.com/protocolbuffers/protobuf/releases and ensure it is in your system PATH.

Error: 'protoc-gen-grpc-web' is not recognized

protoc-gen-grpc-web binary is missing or not executable.

fix

Download and install protoc-gen-grpc-web from https://github.com/grpc/grpc-web/releases, then add its location to PATH.

TypeError: GrpcWebPlugin is not a constructor

Incorrect import style; trying to import as default import in ESM or destructure incorrectly.

fix

Use 'const GrpcWebPlugin = require("grpc-webpack-plugin");' (CommonJS) or use esModuleInterop in TypeScript.

Upgrade

Version history

0.2.79latest on npm

Audit

Dependencies

grpc-webrequiredPeer dependency for generating gRPC-Web client stubs; required at runtime

webpackrequiredPeer dependency; plugin requires webpack to function

protocrequiredSystem tool required to compile .proto files; not an npm package but must be installed

protoc-gen-grpc-webrequiredSystem tool for generating gRPC-Web code; must be installed separately

Agent activity

6 hits · last 30 days

node

Resources

githubhttps://github.com/m8524769/grpc-webpack-plugin ↗

packagegrpc-webpack-plugin ↗

homepagehttps://github.com/m8524769/grpc-webpack-plugin#readme ↗