{"id":30171852,"url":"https://github.com/eunjae-lee/vuex-dry","last_synced_at":"2025-08-11T22:06:57.291Z","repository":{"id":32550777,"uuid":"136460307","full_name":"eunjae-lee/vuex-dry","owner":"eunjae-lee","description":"[NO LONGER MAINTAINED] `vuex-dry` helps keep your vuex codes DRY.","archived":false,"fork":false,"pushed_at":"2023-01-04T05:38:42.000Z","size":657,"stargazers_count":51,"open_issues_count":15,"forks_count":4,"subscribers_count":6,"default_branch":"master","last_synced_at":"2025-08-09T18:50:17.497Z","etag":null,"topics":["frontend","javascript","state-management","vuejs","vuex"],"latest_commit_sha":null,"homepage":"","language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/eunjae-lee.png","metadata":{"files":{"readme":"README.md","changelog":"CHANGELOG.md","contributing":null,"funding":null,"license":"LICENSE.md","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2018-06-07T10:19:51.000Z","updated_at":"2025-03-21T16:47:04.000Z","dependencies_parsed_at":"2023-01-14T21:34:11.950Z","dependency_job_id":null,"html_url":"https://github.com/eunjae-lee/vuex-dry","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/eunjae-lee/vuex-dry","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/eunjae-lee%2Fvuex-dry","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/eunjae-lee%2Fvuex-dry/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/eunjae-lee%2Fvuex-dry/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/eunjae-lee%2Fvuex-dry/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/eunjae-lee","download_url":"https://codeload.github.com/eunjae-lee/vuex-dry/tar.gz/refs/heads/master","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/eunjae-lee%2Fvuex-dry/sbom","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":269818577,"owners_count":24480067,"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","status":"online","status_checked_at":"2025-08-10T02:00:08.965Z","response_time":71,"last_error":null,"robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":true,"can_crawl_api":true,"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":["frontend","javascript","state-management","vuejs","vuex"],"created_at":"2025-08-11T22:06:54.674Z","updated_at":"2025-08-11T22:06:57.286Z","avatar_url":"https://github.com/eunjae-lee.png","language":"TypeScript","funding_links":[],"categories":["公用事业","Components \u0026 Libraries","Utilities"],"sub_categories":["国家管理","Utilities","State Management"],"readme":"\u003cp align=\"center\"\u003e\u003cimg width=\"256\" src=\"https://raw.githubusercontent.com/eunjae-lee/vuex-dry/master/logo.png\"\u003e\u003c/p\u003e\n\n\n[![Build Status](https://travis-ci.org/eunjae-lee/vuex-dry.svg?branch=master)](https://travis-ci.org/eunjae-lee/vuex-dry)\n[![npm version](http://img.shields.io/npm/v/vuex-dry.svg)](https://npmjs.org/package/vuex-dry)\n[![GitHub stars](https://img.shields.io/github/stars/eunjae-lee/vuex-dry.svg)](https://github.com/eunjae-lee/vuex-dry/stargazers)\n[![GitHub forks](https://img.shields.io/github/forks/eunjae-lee/vuex-dry.svg)](https://github.com/eunjae-lee/vuex-dry/network)\n[![Twitter](https://img.shields.io/twitter/url/https/github.com/eunjae-lee/vuex-dry.svg?style=social)](https://twitter.com/intent/tweet?text=Wow:\u0026url=https%3A%2F%2Fgithub.com%2Feunjae-lee%2Fvuex-dry)\n\n## NO LONGER MAINTAINED\n\nThis repository is not actively maintained.\nI haven't used this package for a year.\nIt means there has been no change.\n\nYou can still use this as long as it works in your environment.\nI do not guarantee it works with Vue 3.\n\nYou may want to check out another libraries like [pinia](https://github.com/posva/pinia)\n\n## Introduction\n\n`vuex-dry` helps keep your vuex code DRY.\nIt doesn't introduce any whole new way to use vuex.\nIt just helps build modules for you with a minimum amount of code, adding some convenient getters, mutations, and actions.\n\n`vuex-dry` is TypeScript-friendly since it's written in TypeScript.\n\n\u003c!-- basic --\u003e\n\n## Install\n\n```bash\nnpm i vuex-dry -S\n```\n\nAdd the plugin to your vuex store.\n\n```js\nimport { plugin } from \"vuex-dry\";\n\nnew Vuex.Store({\n  plugins: [plugin],\n  ...\n});\n```\n\n## Getting Started\n\n### Simple Module\n\n```js\nimport { Module } from \"vuex-dry\";\n\nconst user = Module.build({\n  state() {\n    return {\n      name: undefined\n    };\n  }\n});\n\nconst store = new Vuex.Store({\n  modules: {\n    user\n  }\n});\n```\n\nThat's it. At `Module.build()`, we put a function named `state` returning an object. This object will be used as an initial state and also used when you want to reset a specific state or even whole state. We'll see how to reset things later.\n\nLet's look at the module building part again.\n\n```js\nModule.build({\n  state() {\n    return {\n      name: undefined\n    };\n  }\n});\n```\n\nThe code above is effectively same as the following:\n\n```js\n{\n  namespaced: true,\n  state {\n    name: undefined\n  },\n  getters: {\n    name: state =\u003e state.name\n  },\n  mutations: {\n    name$assign(state, value) {\n      state.name = value;\n    },\n    name$reset(state) {\n      state.name = undefined;\n    },\n    $resetAll(state) {\n      state.name = undefined;\n      // also resetting other states if exists\n    }\n  },\n  actions: {\n    name$assign({ commit }, value) {\n      commit(\"name$assign\", value);\n    },\n    name$reset({ commit }) {\n      commit(\"name$reset\");\n    },\n    $resetAll({ commit }) {\n      commit(\"$resetAll\");\n    }\n  }\n})\n```\n\nYou see what has been done here?\n\nThe followings are added to your module:\n\n- A getter `name`\n- A mutation and an action `name$assign` to set a value to the state `name`.\n- A mutation and an action `name$reset` to reset the state `name`.\n- A mutation and an action `$resetAll` to reset all states from the module.\n\nThese are always repeated every time we write vuex code. And now you don't need them anymore.\n\n\u003c!-- basicstop --\u003e\n\n## Interested?\n\nLet me show you how easy you can access/handle arrays and objects with `vuex-dry`.\n\nAnd you will see how to map those getters in your component and you even can map a specific nested property of an object.\n\n➡️ [READ THE FULL DOCUMENT📜](https://github.com/eunjae-lee/vuex-dry/blob/master/DOCUMENT.md#adding-your-own-getters-mutations-and-actions) (It will probably take only 3 minutes)\n\n## So, why `vuex-dry`?\n\nIt keeps your code DRY. You don't have to write meaningless similar codes over and over again.\n\n### Then why not `vuex-pathify`?\n\n`vuex-pathify` is a great library. It let you do things without any coding but just with conventions. A downside is it introduces its own conventions and once you get started with it, you're in a whole new thing. On some level, you're using vuex through APIs of `vuex-pathify`, but on the outside you actually are not using `vuex` anymore.\n\nOn the other hand, `vuex-dry` just simply creates vuex modules and they are completely compatible with your existing vuex store and modules. And since it's creating pure vuex modules, you can extend it as you want. It's highly customizable. In that sense, it's really easy to introduce `vuex-dry` into your current project and you don't even have to replace all your vuex codes with `vuex-dry`. You can partially adjust `vuex-dry` and there's no problem with that.\n\n## Contributing\n\n1.  Fork it!\n2.  Create your feature branch: git checkout -b my-new-feature\n3.  Commit your changes: git commit -am 'Add some feature'\n4.  Push to the branch: git push origin my-new-feature\n5.  Submit a pull request :D\n\n## Author\n\nEunjae Lee, Released under the [MIT](https://github.com/eunjae-lee/vuex-dry/blob/master/LICENSE.md) License.\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Feunjae-lee%2Fvuex-dry","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Feunjae-lee%2Fvuex-dry","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Feunjae-lee%2Fvuex-dry/lists"}