https://github.com/newraina/ts-plugin-mst-async-action

Converts mobx-state-tree async actions to flows
https://github.com/newraina/ts-plugin-mst-async-action

mobx mobx-state-tree plugin typescript

Last synced: 9 months ago
JSON representation

Converts mobx-state-tree async actions to flows

• Host: GitHub
• URL: https://github.com/newraina/ts-plugin-mst-async-action
• Owner: newraina
• License: mit
• Created: 2018-09-04T09:13:51.000Z (almost 8 years ago)
• Default Branch: master
• Last Pushed: 2018-09-27T07:25:40.000Z (over 7 years ago)
• Last Synced: 2025-01-09T08:12:27.155Z (over 1 year ago)
• Topics: mobx, mobx-state-tree, plugin, typescript
• Language: TypeScript
• Size: 39.1 KB
• Stars: 8
• Watchers: 2
• Forks: 1
• Open Issues: 1
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

          
# ts-plugin-mst-async-action

[![npm](https://img.shields.io/npm/v/ts-plugin-mst-async-action.svg)](https://www.npmjs.com/package/ts-plugin-mst-async-action)

[![travis-ci](https://travis-ci.com/newraina/ts-plugin-mst-async-action.svg?branch=master)](https://travis-ci.com/newraina/ts-plugin-mst-async-action)

Converts mobx-state-tree async actions to flows. inspired by [babel-plugin-mobx-async-action](https://github.com/Strate/babel-plugin-mobx-async-action)

## Example

### In

```ts

import { types } from 'mobx-state-tree'

const store = types.model({ count: 0 }).actions(self => ({

  async getCount() {

    self.count = await api.getCount()

  }

}))

```

### Out

```ts

import { types } from 'mobx-state-tree'

import { flow } from 'mobx-state-tree'

const store = types.model({ count: 0 }).actions(self => ({

  getCount: flow(function*() {

    self.count = yield api.getCount()

  })

}))

```

## Usage

### With ts-loader

```js

// webpack.config.js

const tsMstAsyncActionPluginFactory = require('ts-plugin-mst-async-action')

module.exports = {

  // ...

  module: {

    rules: [

      {

        test: /\.(tsx|ts)$/,

        loader: 'ts-loader',

        options: {

          getCustomTransformers: () => ({

            before: [tsMstAsyncActionPluginFactory(/** options */)]

          }),

          compilerOptions: {

            module: 'es2015'

          }

        }

      }

    ]

  }

  // ...

}

```

### Options

- mstPackage `string`

  if you use wrapper for "mobx-state-tree" package, you can pass it's name to plugin

  default: `'mobx-state-tree'`