@bradgarropy/gatsby-link
TypeScript icon, indicating that this package has built-in type declarations

1.0.3Β β€’Β PublicΒ β€’Β Published

πŸ”— gatsby link

version downloads size github actions coverage typescript contributing contributors discord

πŸ”— link component for gatsby

Gatsby provides a <Link> component for routing between internal pages. For external links, you have to use a regular <a> tag. This gatsby-link package solves that issue by providing a <Link> component that handles both internal and external urls.

next link

πŸ“¦ Installation

This package is hosted on npm.

npm install @bradgarropy/gatsby-link

πŸ₯‘ Usage

For both internal and external links, use the Link component and pass it a to prop.

import Link from "@bradgarropy/gatsby-link"

const App = () => {
    return <Link to="https://bradgarropy.com">website</Link>
}

πŸ“– API Reference

<Link>

Name Required Default Example Description
to true "/home"
"https://bradgarropy.com"
Internal or external url.

The component also passes through all other props, like className or activeStyle. See the Gatsby Link documentation for other relevant props. The examples below cover some common uses.

// internal link
<Link to="/home">home</Link>

// internal link with additional props
<Link to="/home" className="nav-link">home</Link>

// external link
<Link to="https://bradgarropy.com">website</Link>

// external link with additional props
<Link to="https://bradgarropy.com" className="nav-link">website</Link>

❔ Questions

πŸ› report bugs by filing issues
πŸ“’ provide feedback with issues or on twitter
πŸ™‹πŸΌβ€β™‚οΈ use my ama or twitter to ask any other questions

✨ contributors


Brad Garropy

πŸ’» πŸ“– ⚠️ πŸš‡

Corbin Crutchley

πŸ“–

Package Sidebar

Install

npm i @bradgarropy/gatsby-link

Weekly Downloads

7

Version

1.0.3

License

MIT

Unpacked Size

10.8 kB

Total Files

9

Last publish

Collaborators

  • bradgarropy