Neutral Political Machine


    6.2.2 • Public • Published

    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




    npm i @charlietango/react-docs-net

    DownloadsWeekly Downloads






    Unpacked Size

    57.6 kB

    Total Files


    Last publish


    • thebuilder
    • frederik_bosch