https://github.com/edvardchen/protobuf-jsx
create statically generated message object from jsx
https://github.com/edvardchen/protobuf-jsx
Last synced: about 1 year ago
JSON representation
create statically generated message object from jsx
- Host: GitHub
- URL: https://github.com/edvardchen/protobuf-jsx
- Owner: edvardchen
- Created: 2020-03-05T06:14:46.000Z (over 6 years ago)
- Default Branch: master
- Last Pushed: 2023-07-18T21:10:38.000Z (almost 3 years ago)
- Last Synced: 2025-05-29T02:17:30.244Z (about 1 year ago)
- Language: JavaScript
- Size: 934 KB
- Stars: 5
- Watchers: 2
- Forks: 0
- Open Issues: 6
-
Metadata Files:
- Readme: README.md
- Changelog: CHANGELOG.md
Awesome Lists containing this project
README
# protobuf-jsx
create statically generated message object from jsx
## Why
While we use statically generated javascript code,
we can't simply create `Message` object from plain object
due to missing `fromObject` method (as the reverse of `toObject`)
See more in [this issue](https://github.com/protocolbuffers/protobuf/issues/1591)
Before official support for `fromObject` method, we can use `protobuf-jsx` as a friendly workaround.
## Installation
```bash
npm i -S protobuf-jsx
```
## Usage
1. Enable `jsx` in `tsconfig.json`
```json
{
"compilerOptions": {
"jsx": "react",
"jsxFactory": "Protobuf.createMessage"
}
}
```
> If you don't use TypeScript, check out how to register jsx factory for your tool chain.
2. Write `jsx` in your javascript file.
```js
import Protobuf from '../src';
import { Feature, Point } from './fixtures/static_codegen/route_guide_pb';
const feature: Feature = (
}>
);
// or using children render function
const feature: Feature = (
{() => ({ location: })}
);
```
## Work with eslint
The following configurations prevent variables used in JSX to be marked as unused.
````yml
rules:
react/jsx-uses-vars: 2
plugins:
- react```
````