{"id":15063137,"url":"https://github.com/developmint/vue-link","last_synced_at":"2025-08-22T00:32:29.017Z","repository":{"id":32409498,"uuid":"132750381","full_name":"Developmint/vue-link","owner":"Developmint","description":"One component to link them all 🔗","archived":false,"fork":false,"pushed_at":"2024-04-14T09:12:22.000Z","size":327,"stargazers_count":63,"open_issues_count":16,"forks_count":7,"subscribers_count":3,"default_branch":"master","last_synced_at":"2024-04-14T10:15:31.272Z","etag":null,"topics":["link","linking","links","nuxt","nuxtjs","vue","vue-components","vue-plugin","vuejs"],"latest_commit_sha":null,"homepage":"","language":"JavaScript","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/Developmint.png","metadata":{"files":{"readme":"README.md","changelog":"CHANGELOG.md","contributing":"CONTRIBUTING.md","funding":null,"license":"LICENSE.md","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null}},"created_at":"2018-05-09T11:59:48.000Z","updated_at":"2024-04-15T18:38:47.223Z","dependencies_parsed_at":"2024-04-15T18:38:36.865Z","dependency_job_id":null,"html_url":"https://github.com/Developmint/vue-link","commit_stats":{"total_commits":51,"total_committers":7,"mean_commits":7.285714285714286,"dds":"0.23529411764705888","last_synced_commit":"0b335a8d53fa80fd37e6c1be219f4e6f48a8b0f0"},"previous_names":[],"tags_count":12,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Developmint%2Fvue-link","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Developmint%2Fvue-link/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Developmint%2Fvue-link/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Developmint%2Fvue-link/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/Developmint","download_url":"https://codeload.github.com/Developmint/vue-link/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":230542289,"owners_count":18242332,"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":["link","linking","links","nuxt","nuxtjs","vue","vue-components","vue-plugin","vuejs"],"created_at":"2024-09-24T23:51:52.637Z","updated_at":"2024-12-20T06:07:17.866Z","avatar_url":"https://github.com/Developmint.png","language":"JavaScript","readme":"# VueLink - One component to link them all!\n\n\u003cp align=\"center\"\u003e\n  \u003ca href=\"https://travis-ci.com/Developmint/vue-link\"\u003e\u003cimg src=\"https://travis-ci.com/Developmint/vue-link.svg?branch=master\" alt=\"Build Status\"\u003e\u003c/a\u003e\n  \u003ca href=\"https://codecov.io/gh/Developmint/vue-link\"\u003e\u003cimg src=\"https://codecov.io/gh/Developmint/vue-link/branch/master/graph/badge.svg\" alt=\"Code coverage\"\u003e\u003c/a\u003e\n  \u003ca href=\"https://www.npmjs.com/package/vue-link\"\u003e\u003cimg src=\"https://img.shields.io/npm/dm/vue-link.svg\" alt=\"Downloads\"\u003e\u003c/a\u003e\n  \u003ca href=\"https://www.npmjs.com/package/vue-link\"\u003e\u003cimg src=\"https://img.shields.io/npm/v/vue-link.svg\" alt=\"Version\"\u003e\u003c/a\u003e\n  \u003ca href=\"https://www.npmjs.com/package/vue-link\"\u003e\u003cimg src=\"https://img.shields.io/npm/l/vue-link.svg\" alt=\"License\"\u003e\u003c/a\u003e\n  \u003ca href=\"https://conventionalcommits.org\"\u003e\u003cimg src=\"https://img.shields.io/badge/Conventional%20Commits-1.0.0-yellow.svg\" alt=\"We use Conventional Commits\"\u003e\u003c/a\u003e\n  \u003ca href=\"https://thanks.lichter.io/\"\u003e\u003cimg src=\"https://img.shields.io/badge/thanks-%E2%99%A5-ff69b4.svg\" alt=\"Thanks badge\"\u003e\u003c/a\u003e\n\u003c/p\u003e\n\n\u003e Lightweight wrapper component for external and vue-router links.\n\n## :fire:  Features\n\n- **Tiny functional component**\n- SSR-safe (works with Nuxt.js)\n- Well tested and **documented**\n- Compatible with Node 8.0+\n- Vue (and vue-router) as the only dependencies\n- Highly customizable\n\n## :mag_right: Getting started\n\n\n### :package: Through NPM\n\n```\n$ npm install vue-link\n```\n\n#### Synchronous import\n\n```js\nimport VueLink from 'vue-link'\n// or the slash-forcing variants\n// import { VueLink, VueLinkAddSlash, VueLinkStripSlash } from 'vue-link'\n\nexport default {\n  components: {\n    VueLink\n  }\n}\n\n```\n\n#### Async import\n\n```js\nexport default {\n  components: {\n    VueLink: () =\u003e import('vue-link')\n  }\n}\n\n```\n\n### :link::x: Using a CDN\n\nSorry! No CDN available for VueLink right now.\n\n## :hammer_and_wrench: Usage\n\n### Handling\n\nBefore going into detail, keep in mind that you can customize the component\nas you can do it with a normal `\u003ca\u003e` or `\u003crouter-link\u003e`/`\u003cnuxt-link\u003e` tag.\n\nAll props will be passed down to the internal implementation of `vue-link`\nin case the link is not external.\n\n### Link detection\n\nIf the passed link starts with `http`, it'll be treated as external link.\nYou can use the `external` prop to force treating it as external link as well.\n\n### Prop overview\n\n\n| Prop  |  External only?  | Comment |\n| ---   |       ---        |   ---   |\n| to    |  :x:             | The target of the link. If not set, the link will not be bound (no \"empty href\")|\n| rel   |:white_check_mark:| Will be passed as `rel` attribute to the anchor tag|\n|newTab |:white_check_mark:| If truthy, set `target` attribute to `_blank`|\n|target |:white_check_mark:| Will be passed as `target` attribute to the anchor tag|\n|slashes  | Internal only!   | Settings: `'strip'`, `'add'` or `false`(default). Will force slash endings to either strip or add trailing slashes to your url (`/a` -\u003e `/a/` in `add` mode, vice-versa in `strip`. **Only for internal links**! Also, this will not take query strings into account. Please use `router-link`'s `query` option for them|\n|external |:white_check_mark:| Force to treat the link as external link (use anchor instead of vue-router tag)|\n\n### Types\n\nWith `v1.4.0` two extra components were introduced that reflect the `slashes` settings.\nYou can import them (like the normal `VueLink` component as named imports).\nThe `default` export of the package is still the normal `VueLink` component so no breaking changes\nhave been introduced.\n\nSince `v1.6.0`, a dedicated `ForNuxt` export is available that'll use `NuxtLink` instead of `RouterLink` under the hood \n\n`import { VueLink, VueLinkAddSlash, VueLinkStripSlash, ForNuxt } from '../lib'`\n\n### Example usage\n\n```js\n \u003cvue-link\n          :to=\"`/feed.xml`\"\n          :external=\"true\"\n          :new-tab=\"true\"\n          class=\"block mt-4 lg:inline-block lg:mt-0 w-6 h-6 mr-6 no-underline\"\u003e\n    This is the link text ;)\n\u003c/vue-link\u003e\n```\n\n## :gear: Contributing\n\nPlease see our [CONTRIBUTING.md](./CONTRIBUTING.md)\n\n\n## :bookmark_tabs: License\n\n[MIT License](./LICENSE.md) - Copyright (c) Developmint - Alexander Lichter\n","funding_links":[],"categories":[],"sub_categories":[],"project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fdevelopmint%2Fvue-link","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fdevelopmint%2Fvue-link","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fdevelopmint%2Fvue-link/lists"}