{"id":48100,"library":"grpc-webpack-plugin","title":"gRPC Webpack Plugin","description":"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.","status":"active","version":"0.2.79","language":"javascript","source_language":"en","source_url":"https://github.com/m8524769/grpc-webpack-plugin","tags":["javascript","webpack","plugin","grpc-web","protoc"],"install":[{"cmd":"npm install grpc-webpack-plugin","lang":"bash","label":"npm"},{"cmd":"yarn add grpc-webpack-plugin","lang":"bash","label":"yarn"},{"cmd":"pnpm add grpc-webpack-plugin","lang":"bash","label":"pnpm"}],"dependencies":[{"reason":"Peer dependency for generating gRPC-Web client stubs; required at runtime","package":"grpc-web","optional":false},{"reason":"Peer dependency; plugin requires webpack to function","package":"webpack","optional":false},{"reason":"System tool required to compile .proto files; not an npm package but must be installed","package":"protoc","optional":false},{"reason":"System tool for generating gRPC-Web code; must be installed separately","package":"protoc-gen-grpc-web","optional":false}],"imports":[{"note":"Package is CommonJS only; ESM import may fail or require bundler transformation.","wrong":"import GrpcWebPlugin from 'grpc-webpack-plugin';","symbol":"GrpcWebPlugin","correct":"const GrpcWebPlugin = require('grpc-webpack-plugin');"},{"note":"Some bundlers allow ESM import, but the package has no default export; the require style is safer.","wrong":"const GrpcWebPlugin = require('grpc-webpack-plugin').default;","symbol":"GrpcWebPlugin (ESM)","correct":"import GrpcWebPlugin from 'grpc-webpack-plugin';"},{"note":"TypeScript users should use `import = require()` or esModuleInterop to match CommonJS.","wrong":"import { GrpcWebPlugin } from 'grpc-webpack-plugin';","symbol":"GrpcWebPlugin (TypeScript)","correct":"import GrpcWebPlugin = require('grpc-webpack-plugin');"},{"note":"Destructuring require works, but named import in ESM might resolve to undefined.","wrong":"import { GrpcWebPlugin } from 'grpc-webpack-plugin';","symbol":"GrpcWebPlugin (destructuring)","correct":"const { GrpcWebPlugin } = require('grpc-webpack-plugin');"}],"quickstart":{"code":"// webpack.config.js\nconst GrpcWebPlugin = require('grpc-webpack-plugin');\nconst path = require('path');\n\nconst PROTO_DIR = path.resolve(__dirname, './protos');\nconst OUT_DIR = path.resolve(__dirname, './generated');\n\nmodule.exports = {\n  mode: 'development',\n  plugins: [\n    new GrpcWebPlugin({\n      protoPath: PROTO_DIR,\n      protoFiles: ['my_service.proto'],\n      outputType: 'js',\n      importStyle: 'commonjs',\n      binary: true,\n      outDir: OUT_DIR,\n    }),\n    new GrpcWebPlugin({\n      protoPath: PROTO_DIR,\n      protoFiles: ['my_service.proto'],\n      outputType: 'grpc-web',\n      importStyle: 'commonjs+dts',\n      mode: 'grpcwebtext',\n      outDir: OUT_DIR,\n    }),\n  ],\n};","lang":"typescript","description":"Configures webpack to compile .proto files during build: first generates pure JS message classes, then generates gRPC-Web client stubs with TypeScript definitions."},"warnings":[{"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.","message":"Requires protoc and protoc-gen-grpc-web binaries installed on the system; missing them results in silent failures or build errors.","severity":"gotcha","affected_versions":">=0.2.78"},{"fix":"Upgrade to >=0.2.78 and update configuration to use 'mode' property instead of previous deprecated behavior.","message":"Versions before 0.2.78 used a different option format and did not support the 'mode' option.","severity":"breaking","affected_versions":"<0.2.78"},{"fix":"If using webpack 5, consider alternative plugins or test compatibility; maintain webpack 4 if using this plugin.","message":"Webpack 4 is the only supported version; webpack 5 compatibility is not verified.","severity":"deprecated","affected_versions":">=0.2.78"},{"fix":"Set synchronize: true and webpack watch: true (or use webpack-dev-server with watch enabled).","message":"The 'watch' option only works if 'synchronize' is true; watch mode must also be enabled via webpack's watch option.","severity":"gotcha","affected_versions":">=0.2.78"},{"fix":"Evaluate alternatives if file watching or webpack 5 support is critical.","message":"Notable community fork or alternatives exist (e.g., protoc-gen-ts, buf build) with different trade-offs; no known security incidents.","severity":"gotcha","affected_versions":">=0.2.78"}],"env_vars":null,"search_vec":"'0.2.79':21 '1.0.0':88 '10.12.0':81 '4.0.0':91 'automat':8 'bug':32 'build':19,61 'build-tim':60 'chang':73 'client':43 'closur':47 'commonj':48,49 'compil':9,64 'depend':84 'differenti':59 'dts':50 'elimin':65 'file':11,69,78 'fix':33 'focus':30 'format':54 'grpc':1,14,41,86,96 'grpc-web':13,40,85,95 'grpcweb':57 'grpcwebtext':56 'import':45 'invoc':68 'javascript':39,92 'key':58 'latest':24 'manual':66 'mode':55 'multipl':36 'node':80 'output':37 'peer':83 'plugin':3,6,94 'proto':10,63,72,77 'protoc':17,67,98 'recent':28 'releas':26 'requir':79 'sourc':76 'stabl':25 'stub':44 'style':46 'support':35 'synchron':74 'time':62 'type':38 'typescript':51 'updat':29 'version':20 'watch':70 'web':15,42,87,97 'webpack':2,5,90,93 'wire':53","created_at":"2026-06-07T16:54:55.384317+00:00","updated_at":"2026-06-07T16:54:55.384317+00:00","problems":[{"fix":"Run 'npm install --save-dev grpc-webpack-plugin' or 'yarn add --dev grpc-webpack-plugin'.","cause":"Plugin not installed or not listed in devDependencies.","error":"Error: Cannot find module 'grpc-webpack-plugin'"},{"fix":"Install protoc from https://github.com/protocolbuffers/protobuf/releases and ensure it is in your system PATH.","cause":"protoc binary is not installed or not in PATH.","error":"Error: 'protoc' command not found"},{"fix":"Download and install protoc-gen-grpc-web from https://github.com/grpc/grpc-web/releases, then add its location to PATH.","cause":"protoc-gen-grpc-web binary is missing or not executable.","error":"Error: 'protoc-gen-grpc-web' is not recognized"},{"fix":"Use 'const GrpcWebPlugin = require(\"grpc-webpack-plugin\");' (CommonJS) or use esModuleInterop in TypeScript.","cause":"Incorrect import style; trying to import as default import in ESM or destructure incorrectly.","error":"TypeError: GrpcWebPlugin is not a constructor"}],"ecosystem":"npm","meta_description":null,"install_score":null,"quickstart_score":null,"quickstart_tag":null,"pypi_latest":null,"cli_name":null,"cli_version":null,"type":"library","homepage":"https://github.com/m8524769/grpc-webpack-plugin#readme","github":"https://github.com/m8524769/grpc-webpack-plugin","docs":null,"changelog":null,"pypi":null,"npm":"grpc-webpack-plugin","openapi_spec":null,"status_page":null,"smithery":null,"categories":["devops"],"base_url":null,"auth_type":null,"provenance":{"verified_status":null,"verified_at":null,"last_verified":"2026-06-07","next_check":"2026-09-05","install_tag":null}}