# ember-href-to

> A lightweight alternative to `{{link-to}}`

Latest version **5.1.1** (published 2026-06-30) · Apache-2.0 license · 0 weekly downloads

## Install

```sh
npm install ember-href-to
pnpm add ember-href-to
yarn add ember-href-to
bun add ember-href-to
```

## Health

**Score 60/100 (C)** — status: active.

Positive: no vulnerabilities; has provenance; recently updated; high maintenance score.

Warnings: low downloads; no types; no esm support.

## Facts

| | |
|---|---|
| Version | 5.1.1 |
| Published | 2026-06-30 |
| First published | 2015-07-15 |
| Weekly downloads | 0 |
| License | Apache-2.0 |
| TypeScript types | none |
| Module format | CommonJS |
| Node | 12.* \|\| 14.* \|\| >= 16 |
| Dependencies | 1 |
| Unpacked size | 416.7 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| Provenance | attested (GitHub Actions) |
| GitHub stars | 0 |
| Maintainers | real_ate |
| Keywords | ember-addon |

## Links

- npm: https://www.npmjs.com/package/ember-href-to
- Repository: https://github.com/adopted-ember-addons/ember-href-to
- Homepage: https://github.com/adopted-ember-addons/ember-href-to#readme
- Issues: https://github.com/adopted-ember-addons/ember-href-to/issues
- npm.io page: https://npm.io/package/ember-href-to

## Dependencies (1)

- [ember-cli-babel](https://npm.io/package/ember-cli-babel.md) ^7.26.6

## Recent versions

- 5.1.1 (latest) — 2026-06-30
- 5.1.0 — 2026-06-29
- 5.0.6 — 2024-09-13
- 5.0.3 — 2024-09-13
- 5.0.1 — 2024-01-10
- 5.0.0 — 2021-11-26
- 4.1.0 — 2020-09-29
- 4.0.0 — 2020-08-06
- 3.1.0 — 2019-03-29
- 3.0.0 — 2019-03-28
- 2.0.1 — 2018-11-30
- 1.15.1 — 2017-11-06
- 1.15.0 — 2017-10-25
- 1.14.0 — 2017-10-19
- 1.13.0 — 2017-06-10
- … 29 more at https://npm.io/package/ember-href-to/versions

## README

# ember-href-to

A lightweight alternative to `{{link-to}}`. No components, no class bindings - just a bound anchor href and a click handler.

[![Ember Observer Score](http://emberobserver.com/badges/ember-href-to.svg)](http://emberobserver.com/addons/ember-href-to)

## Why use it?

Every time you use a `{{link-to}}`, you create a component. This is usually fine, but in cases where you're creating many of these, performance can suffer. `{{href-to}}` simply creates a URL and is [12x faster](https://github.com/GavinJoyce/ember-performance/pull/1) than `{{link-to}}` in Ember 1.13.4.

## Installation

This is an Ember CLI addon, to install:

`ember install ember-href-to`

## Supported Ember Versions

- v5.0.1. supports Ember versions >=3.1 & <3.27
- It does not work in apps using Ember's modernized `LinkTo`, which was introduced in Ember 3.27 and built using Glimmer components. See [this comment](https://github.com/intercom/ember-href-to/pull/152#issuecomment-1882813145) for more info.

## Usage Instructions

`{{href-to}}` has the same interface as [`{{link-to}}`](https://guides.emberjs.com/v2.16.0/templates/links/), you can use it to link to static and dynamic routes in your ember application:

```html
<a href="{{href-to 'index'}}">Go Home</a>
<a href="{{href-to 'contacts.contact' contact}}">View Contact 1</a>
<a href="{{href-to 'contacts.contact' 2}}">View Contact 2</a>
<a href="{{href-to 'contact-us' (query-params section='first')}}"
  >You can also use query params</a
>
<a href="{{href-to 'contact-us'}}#first"
  >You can also use fragment identifiers</a
>
<a href="{{href-to 'contact-us'}}" data-href-to-ignore>
  If you have a catchall route (this.route('catchall', { path: "/*" })), you
  need to add the attribute "data-href-to-ignore", otherwise you will always
  match it
</a>
```

As `{{href-to}}` simply generates a URL, you won't get automatic `active` class bindings as you do with `{{link-to}}`. Clicking on a `{{href-to}}` URL will trigger a full router transition though:

![href-to2](https://cloud.githubusercontent.com/assets/2526/8709271/0a8b934a-2b39-11e5-8f24-89ece7d6c45d.gif)

## Development Instructions

- `git clone` this repository
- `npm install`

### Running

- `ember server`
- Visit your app at http://localhost:4200.

---
_Source: https://npm.io/package/ember-href-to · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._
