{"id":13508576,"url":"https://github.com/mobxjs/babel-plugin-mobx-deep-action","last_synced_at":"2025-08-20T09:07:24.339Z","repository":{"id":57151523,"uuid":"75326401","full_name":"mobxjs/babel-plugin-mobx-deep-action","owner":"mobxjs","description":"Reduces `action` and `runInAction` boilerplates","archived":false,"fork":false,"pushed_at":"2019-04-17T20:28:58.000Z","size":39,"stargazers_count":108,"open_issues_count":1,"forks_count":4,"subscribers_count":5,"default_branch":"master","last_synced_at":"2024-04-24T15:13:42.183Z","etag":null,"topics":["async","babel-plugin","decorators","mobx"],"latest_commit_sha":null,"homepage":null,"language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/mobxjs.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2016-12-01T19:41:10.000Z","updated_at":"2024-04-15T20:30:04.000Z","dependencies_parsed_at":"2022-09-06T07:01:39.360Z","dependency_job_id":null,"html_url":"https://github.com/mobxjs/babel-plugin-mobx-deep-action","commit_stats":null,"previous_names":[],"tags_count":11,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/mobxjs%2Fbabel-plugin-mobx-deep-action","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/mobxjs%2Fbabel-plugin-mobx-deep-action/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/mobxjs%2Fbabel-plugin-mobx-deep-action/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/mobxjs%2Fbabel-plugin-mobx-deep-action/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/mobxjs","download_url":"https://codeload.github.com/mobxjs/babel-plugin-mobx-deep-action/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":236745690,"owners_count":19198060,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["async","babel-plugin","decorators","mobx"],"created_at":"2024-08-01T02:00:55.043Z","updated_at":"2025-02-10T02:09:28.284Z","avatar_url":"https://github.com/mobxjs.png","language":"JavaScript","funding_links":[],"categories":["JavaScript"],"sub_categories":[],"readme":"# babel-plugin-mobx-deep-action\n\n[![Build Status](https://travis-ci.org/mobxjs/babel-plugin-mobx-deep-action.svg?branch=master)](https://travis-ci.org/mobxjs/babel-plugin-mobx-deep-action)\n[![npm version](https://badge.fury.io/js/babel-plugin-mobx-deep-action.svg)](https://badge.fury.io/js/babel-plugin-mobx-deep-action)\n\nAllow to reduce boilerplate of writing async actions.\nBased on assumption, that all code created inside an action,\nshould be handled as action too.\n\nThis plugin scans for all functions, marked as actions, and then marks all\nnested functions, which created inside actions as actions too.\n\n* [Usage with async and generator functions](#toc-usage-async)\n* [Typescript decorators](#toc-typescript-decorators)\n* [Use other package](#toc-mobx-package)\n\n## Example\n\n**In**\n\n```js\nimport { action } from \"mobx\";\n\naction(function doSome() {\n  fetch(\"/api/list\").then(function(response) {\n    this.items = response.dta;\n  });\n});\n```\n\n**Out**\n\n```js\n\"use strict\";\n\nimport { action } from \"mobx\";\n\naction(function doSome() {\n  fetch(\"/api/list\").then(action(function(response) {\n    this.items = response.dta;\n  }));\n});\n```\n\n## Caveats\n\nPlugin support only ES6 imports. Only these imports are supported:\n```\nimport {action} from \"mobx\";\n```\n```\nimport {action as actionAlias} from \"mobx\";\n```\n```\nimport * as mobx from \"mobx\";\n```\n```\nimport * as mobxAlias from \"mobx\";\n```\nFor example, these cases are **not supported**:\n```\nconst mobx = require(\"mobx\")\n```\n```\nconst {action} = require(\"mobx\")\n```\n```\nimport * as mobx from \"my-mobx-alias\"\n```\n```\nimport * as mobx from \"mobx\";\nconst {action} = mobx;\naction(function() {});\n```\n\n\n## Installation\n\n```sh\n$ npm install babel-plugin-mobx-deep-action\n```\n\n## Usage\n\n### Via `.babelrc` (Recommended)\n\n**.babelrc**\n\n```json\n{\n  \"plugins\": [\"mobx-deep-action\"]\n}\n```\n\n### Via CLI\n\n```sh\n$ babel --plugins mobx-deep-action script.js\n```\n\n### Via Node API\n\n```javascript\nrequire(\"babel-core\").transform(\"code\", {\n  plugins: [\"mobx-deep-action\"]\n});\n```\n\n\n## \u003ca id=\"toc-usage-async\"\u003e\u003c/a\u003e Usage for async and generator functions.\n\nsee https://github.com/Strate/babel-plugin-mobx-async-action\n\n## \u003ca id=\"toc-typescript-decorators\"\u003e\u003c/a\u003e Typescript decorators.\n\nThis plugin could handle decorators code, emitted from typescript, such as:\n\n```js\nimport * as tslib_1 from \"tslib\";\nimport { action } from \"mobx\";\nexport default class Class2 {\n    async method() {\n        const a = (other) =\u003e { };\n        return a(function () { });\n    }\n}\ntslib_1.__decorate([\n    action\n], Class2.prototype, \"method\", null);\n```\n\nTo get this code worked, you should enable [importHelpers](https://www.typescriptlang.org/docs/handbook/compiler-options.html)\ncompiler option, and get [tslib](https://www.npmjs.com/package/tslib) package installed. Also, typescript\nshould emit es6 modules, so, you should target your compiler to es2015+. That's all,\nplugin detect import from \"tslib\" and handle typescript decorators.\n\n## \u003ca id=\"toc-mobx-package\"\u003e\u003c/a\u003e Use other package.\n\nIf you use wrapper for \"mobx\" package, you can pass it's name to plugin:\n\n#### .babelrc\n\n```json5\n{\n  \"plugins\": [\n    [\"mobx-deep-action\", {\n      \"mobx-package\": \"mobx-custom\"\n    }]\n  ]\n}\n```\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fmobxjs%2Fbabel-plugin-mobx-deep-action","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fmobxjs%2Fbabel-plugin-mobx-deep-action","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fmobxjs%2Fbabel-plugin-mobx-deep-action/lists"}