Getting Started
Installation and setup guide for React MVVM
Installation
Run the following command to add React MVVM and all needed libraries:
npm install react-mvvm mobx mobx-react-lite reflect-metadataPreparation
You must import reflect-metadata in your main script file so that you can use the decorators. You can also configure this package, but this step is optional.
Import reflect-metadata in your main entry file:
import 'reflect-metadata';
import { configure } from 'react-mvvm';
import { createRoot } from 'react-dom/client';
// Optional step
configure({
// Configuration options
});
createRoot(document.getElementById('root')!).render(<App />);You can use mobx with versions 4, 5 or 6. And it's recommended to use the 6th one.
In case you want to use versions 4 or 5 you should add the following code to your webpack configuration:
module.exports = {
// ...
ignoreWarnings: [
{
module: /react-mvvm/,
},
],
// ...
};Usage
You can find examples of using this package in the examples section.
Further reading
Despite the fact that React MVVM is an extremely small library, it can greatly affect the development process. For a better understanding of the beauty of this library, we advise you to read an article about MobX and MVVM.