Package and publish a NuGet package to a custom feed.

Usage no npm install needed!

<script type="module">
  import charlietangoReactDocsNet from 'https://cdn.skypack.dev/@charlietango/react-docs-net';


React Docs Net

Take the JSON output from react-docgen, and convert it to C# ViewModels for consumption in .NET projects. Why would you do this? It allows us to define the ViewModels in the Frontend where we actually use them.

⚠️ Warning

This is a basic rewrite of the React props to C#/.NET. No validation is done on the actual files. Not all Flow features are supported, since there's not a simple way to convert them to C#.

  • All models are converted to upper camelcase, with ViewModel appendend.
  • Enum models are converted to upper camelcase, with Types appended
  • Flow number is converted to int. Use @type {TYPE} in comment tag for the prop, to change the number type.


  • Node 8.x+
  • Flow Currently only supports extracting models from Flow Types.
  • react-docgen JSON files


Add the dependency

yarn add @charlietango/react-docs-net --dev

Generate JSON files with react-docgen, and process them:

const docNet = require('@charlietango/react-docs-net');

docNet.createModels([{name: 'CustomModel', docs: {...}}], {
  namespace: 'Dk.CharlieTango',
  dest: 'dist/models', // Add dest to write to files

or calling the bin

$ react-doc-net src/models/**/*.json --ns Dk.CharlieTango --dest dist/models

The .cs view models will be created in dist/models.


Name Type Default Description
namespace string Namespace to use in all the models
dest string Write .cs files to the this path
verbose boolean false Output extra logging
quiet boolean false Don't output anything to log

JSDoc flags

You can use these flags in JS comments to modify how a prop is handled.

  • @internal - Ignore this prop - It's only used internally in the React App.
  • @type - Set a specific C# type for this prop - Like decimal
  • @static - Marks classes or fields as static.
  • @generic - Should always be put above a generic prop
  • @genericTypes T: Enum - Optional. Should be placed before the current type definition