Next.js Link Autocomplete
Autocomplete for Next.js <Link> href attributes based on your project routes.
Features
- Autocompletes
<Link href=""> and <Link href={}> in Next.js projects.
- Supports both
app/ and src/app/ directories.
- Handles dynamic routes like
/blog/[id].
- Works with:
href="/"
href={""}
href={/}
- Partial typing inside quotes or braces.
Installation
- Clone the repository.
- Open the project in VS Code.
- Press
F5 to launch the extension in a new Extension Host window.
- Open a
.tsx or .jsx file and start typing <Link href=" or <Link href={.
Usage
import Link from "next/link"
export default function Example() {
return (
<div>
<Link href="/">Home</Link>
<Link href="/about">About</Link>
<Link href={`/blog/[id]`}>Blog</Link>
</div>
)
}
| |