{"id":22800983,"url":"https://github.com/wimil/vue-timeago2","last_synced_at":"2025-03-30T19:27:00.725Z","repository":{"id":57158370,"uuid":"224930667","full_name":"wimil/vue-timeago2","owner":"wimil","description":"A timeago filter for Vue using date-fns.","archived":false,"fork":false,"pushed_at":"2019-12-07T01:37:05.000Z","size":7,"stargazers_count":0,"open_issues_count":0,"forks_count":0,"subscribers_count":1,"default_branch":"master","last_synced_at":"2025-03-21T07:35:33.971Z","etag":null,"topics":[],"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/wimil.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":"2019-11-29T22:38:34.000Z","updated_at":"2019-12-07T01:37:07.000Z","dependencies_parsed_at":"2022-09-07T21:01:01.730Z","dependency_job_id":null,"html_url":"https://github.com/wimil/vue-timeago2","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/wimil%2Fvue-timeago2","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/wimil%2Fvue-timeago2/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/wimil%2Fvue-timeago2/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/wimil%2Fvue-timeago2/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/wimil","download_url":"https://codeload.github.com/wimil/vue-timeago2/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":246367822,"owners_count":20765935,"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":[],"created_at":"2024-12-12T08:08:35.200Z","updated_at":"2025-03-30T19:27:00.698Z","avatar_url":"https://github.com/wimil.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# vue-timeago2 [![NPM version](https://img.shields.io/npm/v/vue-timeago2.svg)](https://npmjs.com/package/vue-timeago2) [![NPM downloads](https://img.shields.io/npm/dm/vue-timeago2.svg)](https://npmjs.com/package/vue-timeago2)\n\n\u003e A timeago component Vue.js\n\n## Install\n\n```bash\nyarn add vue-timeago2\n# or\nnpm i vue-timeago2\n```\n\n## Usage\n\n```js\nimport VueTimeago2 from \"vue-timeago2\";\n\nVue.use(VueTimeago2, {\n  name: \"Timeago\", // Component name, `Timeago` by default\n  locale: \"en\", // Default locale\n  // We use `date-fns` under the hood\n  // So you can use all locales from it\n  locales: {\n    \"zh-CN\": require(\"date-fns/locale/zh_cn/index\"),\n    es: require(\"date-fns/locale/es/index\")\n  }\n});\n```\n\nThen in your lovely component:\n\n```vue\n\u003c!-- simple usage --\u003e\n\u003c!-- time is a dateString that can be parsed by Date.parse() --\u003e\n\u003ctimeago :datetime=\"time\"\u003e\u003c/timeago\u003e\n//return in about 1 hour\n\n\u003c!-- Convert type --\u003e\n\u003c!-- You can use both converters by default: default or strict --\u003e\n\u003ctimeago :datetime=\"time\" typeConvert=\"strict\"\u003e\u003c/timeago\u003e\n//return '6 months'\n\n\u003c!-- Auto-update time every 60 seconds --\u003e\n\u003ctimeago :datetime=\"time\" :auto-update=\"60\"\u003e\u003c/timeago\u003e\n\n\u003c!-- custom locale --\u003e\n\u003c!-- use a different locale instead of the global config --\u003e\n\u003ctimeago :datetime=\"time\" locale=\"zh-CN\"\u003e\u003c/timeago\u003e\n```\n\n## Plugin options\n\n```js\nVue.use(VueTimeago, pluginOptions);\n```\n\n### locales\n\n- **Type**: `{ [localeName: string]: any }`\n\nAn object of locales.\n\n### locale\n\n- **Type**: `string`\n\nThe default locale name.\n\n### converter\n\n- **Type**: `(date, locale, converterOptions) =\u003e string`\n\nA `converter` that formats regular dates in `xxx ago`, `in xxx` or `xxx days` style.\n\nWe have two [converters](https://github.com/wimil/vue-timeago2/blob/master/src/converts.js) that format time: [toNow](https://date-fns.org/v2.8.1/docs/formatDistance) and [Strict](https://date-fns.org/v2.8.1/docs/formatDistanceStrict). usando [date-fns](https://date-fns.org/v2.8.1/docs/) 2.8.1\n\n### converterOptions\n\n- **Type**: `Object`\n\nProvide an object which will be available as argument `converterOptions` in the `converter` we mentioned above.\n\nOur default converter supports most options that [date-fns](https://date-fns.org/2.8.1/docs/distanceInWordsToNow) library supports, namely:\n\n- **includeSeconds**: (default: `false`) distances less than a minute are more detailed\n- **addSuffix**: (default: `true`) result specifies if the second date is earlier or later than the first\n- **roundingMethod** (default: `rounded`) only for strict type conversion\n\n## props\n\n### datetime\n\n- **Type**: `Date` `string` `number`\n- **Required**: `true`\n\nThe datetime to be formatted .\n\n### autoUpdate\n\n- **Type**: `number` `boolean`\n- **Default**: `false`\n\nThe period to update the component, in **seconds**.\n\nYou can omit this prop or set it to `0` or `false` to disable auto-update.\n\nWhen `true` it will be equivalent to `60`.\n\n### locale\n\nJust like the `locale` option in the plugin options, but this could override the global one.\n\n### converter\n\nJust like the `converter` option in the plugin options, but this could override the global one.\n\n### typeConvert\n\n- **default**: Return the distance between the given dates in words.\n- **strict**: Return the distance between the given dates in words, using strict units. This is like `formatDistance`, but does not use helpers like 'almost', 'over', 'less than' and the like.`\n\n### converterOptions\n\nJust like the `converterOptions` option in the plugin options, but this could override the global one.\n\n## Recipes\n\n### Update Locale Globally\n\n```js\nVue.use(VueTimeago, {\n  locale: \"en\",\n  locales: {\n    \"zh-CN\": require(\"date-fns/locale/zh_cn/index\")\n  }\n});\n```\n\nIn your components you can use `this.$timeago.locale` to access the global locale, in this case it's `en`, the `\u003ctimeago\u003e` component will get updated when you set it to another valid locale, e.g. `this.$timeago.locale = 'zh-CN'`.\n\n## License\n\nMIT © [Wimil](https://github.com/wimil)\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fwimil%2Fvue-timeago2","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fwimil%2Fvue-timeago2","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fwimil%2Fvue-timeago2/lists"}