Error: Assertion Failed: You must provide one or more parameters to the link-to component

Question

I'm following the emberjs tutorial and I am getting an error when adding a <LinkTo> tag. I'm not sure what it means as I can't find any documentation what I need to do to properly construct this tag.

What do I need to do to construct this properly? It doesn't render on the page.

Here is my environment:

ember-cli: 3.6.1

node: 13.12.0

os: darwin x64

Here is the error in the console:

Error: Assertion Failed: You must provide one or more parameters to the link-to component.

Here are the relevant code snippets

app/templates/index.hbs

<div class="jumbo">
  <div class="right tomster"></div>
  <h2>Welcome to Super Rentals!</h2>
  <p>We hope you find exactly what you're looking for in a place to stay.</p>
  <LinkTo @route="about">About</LinkTo>
</div>

app/router.js

import EmberRouter from '@ember/routing/router';
import config from './config/environment';

export default class Router extends EmberRouter {
  location = config.locationType;
  rootURL = config.rootURL;
}

Router.map(function() {
  this.route('about');
});

Answer 1

Your invocation syntax is correct. However, you are referring the guide for the latest version of Ember whereas you have installed Ember version 3.6. You can either bump up your ember version to the latest or if you want to stick to 3.6, here goes the guide for 3.6.

The actual error is due to the fact that the true angle bracket component invocation style for Built-In components was only landed on Ember version 3.10. So, your Ember version has to be => 3.10 to work.

Here is a twiddle that demonstrates the usage of LinkTo component using Ember version 3.17