https://github.com/winterbe/mobx-logger
Log Mobx Actions, Reactions, Transactions and Computations
https://github.com/winterbe/mobx-logger
javascript logger mobx
Last synced: 3 months ago
JSON representation
Log Mobx Actions, Reactions, Transactions and Computations
- Host: GitHub
- URL: https://github.com/winterbe/mobx-logger
- Owner: winterbe
- License: mit
- Created: 2016-08-23T09:17:19.000Z (about 9 years ago)
- Default Branch: master
- Last Pushed: 2023-04-04T15:10:13.000Z (over 2 years ago)
- Last Synced: 2025-06-07T08:42:35.482Z (4 months ago)
- Topics: javascript, logger, mobx
- Language: JavaScript
- Homepage: https://www.npmjs.com/package/mobx-logger
- Size: 721 KB
- Stars: 231
- Watchers: 10
- Forks: 11
- Open Issues: 22
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# MobX Logger
> Always know what is really going on in your MobX application by logging just the right information.
---
★★★ Like this project? Leave a star, follow on Twitter or donate to support my work! Thanks. ★★★
## Install
NPM: `npm install mobx-logger`
CDN: `https://unpkg.com/mobx-logger/mobx-logger.umd.js`
## Usage
```js
import {enableLogging} from 'mobx-logger';
// optional
const config = {...};
enableLogging(config);
```
> For Mobx 3 support please use Mobx Logger 0.6.0.
## Options
Unlike MobX DevTools you can simply configure which particular information should be logged to the console. Currently Actions, Reactions, Transactions and Computations are supported.
```js
{
predicate: () => true|false,
action: true|false,
reaction: true|false,
transaction: true|false,
compute: true|false
}
```
## Logger Config
You can disable logging for actions and computed properties by providing a static `mobxLoggerConfig`. This is useful to keep the console log clean, e.g. when using a large amount of Mobx models which would result in alot of console logs.
Here's an example of how to disable logging for all actions and computed properties for a given class:
```js
class MyModel {
static mobxLoggerConfig: {
enabled: false
};
// ...
}
```
Alternatively you can disable logging for particular class methods:
```js
class MyStore {
static mobxLoggerConfig: {
methods: {
myAction: false
}
};
@action myAction() {
// calls to this method won't be logged
}
}
```
You can combine the above examples to whitelist certain actions for being logged:
```js
class MyStore {
static mobxLoggerConfig: {
enabled: false,
methods: {
myAction: true
}
};
@action myAction() {
// only calls to this method are being logged
}
// other methods won't be logged ...
}
```
> Please keep in mind that at this point `mobxLoggerConfig` is only available for actions (`@action`) and computed properties (`@computed`).
#### ReactNative
For ReactNative development use this predicate to only enable logging in dev mode with JS debugging enabled:
```js
enableLogging({
predicate: () => __DEV__ && Boolean(window.navigator.userAgent),
...
});
```
## License
MIT