Tools for converting type definitions in client side apps to type definitions in server-side languages. Currently supports converting types from React or TypeScript/React to C#, Kotlin or TypeScript.
These tools were developed for adding type safety to websites that employ server-side rendering where the client and server use different languages (like rendering React components in C# using ReactJS.NET). Combining this with CI/CD helps uncover breaking changes in the client/server integration before they reach end users.
npm install --save-dev view-models
To see the CLI help, run view-models --help.
Read more here
Config example. See complete list of options here
const ViewModelsPlugin = require('view-models/webpack-plugin');
const { generators, parsers } = require('view-models');
module.exports = {
entry: { ... },
output: { ... },
plugins: [
new ViewModelsPlugin({
include: [/\.tsx$/],
exclude: ['node_modules', 'some/path/to/exclude'],
compilerOptions: {
parser: parsers.typescriptReact, // Optional
generator: generators.kotlin // Optional
}
})
]
};Read more here
{
"plugins": ["view-models/babel-plugin"]
}Read more here
npm install --save-dev eslint-plugin-view-models
{
"plugins": ["eslint-plugin-view-models"],
"rules": {
"view-models/no-errors": "error",
"view-models/no-unused-meta": "warn",
"view-models/no-meta-mismatch": "warn",
"view-models/no-prop-mapping": "warn"
}
}Only some of the parsers/generators in this package have been properly tested:
- JavaScript-React parser: used in production since 2018
- Typescript-React parser: experimental
- C# generator: used in production since 2018
- TypeScript generator: used in production since 2020
- Kotlin generator: experimental
This is a TypeScript rewrite of @creuna/prop-types-csharp which I created while employed at Creuna. At Creuna we started using ReactJS.NET for server-side rendering pretty heavily around 2017 and soon discovered that a javascript/C# integration can be quite brittle. Breakage was common. I introduced this tool mid-2018 and since sorting out the initial kinks it has been very helpful in reducing runtime breakage.
If you're migrating from @creuna/prop-types-csharp here's a migration guide.