ember-fastboot / ember-cli-head

Ember Cli Addon for Adding Content to HTML Head
MIT License
98 stars 34 forks source link

rootURL favicon link difficulties (not using fastboot) #39

Closed nruth closed 6 years ago

nruth commented 6 years ago

I may have missed something important from the docs, but I think rootURL is being ignored in the head template.

I've been trying to move 2 lines from my app/index file to the head template to avoid ember-cli clashes on update. Not a big deal, but nice to have.

<link rel="icon" href="{{rootURL}}assets/favicon.png">
<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">

The material icons one worked fine, but the favicon one was going in as / instead of prefixing with the rootURL. I've tried using <link rel="icon" href="/assets/favicon.png"> instead hoping broccoli would swap the path out, but that also gave me no prefix.

Moving the 2 lines back to app/index.html I get the expected links.

Is rootURL supposed to work in the head.hbs template, or is it not the right way to try to do this?

ember-source 2.12.2
ember-cli 2.12.3
ember-cli-head 0.4.0
rwjblue commented 6 years ago

I believe you would need to import the rootURL from config/environment and include it in your head template.

nruth commented 6 years ago

That works, thank you!

I added it as a property on the head service and then used {{model.rootURL}} in the head template.

I'd like to PR adding this to the readme; would it be best as a 1-line comment, or as a second full example?

rwjblue commented 6 years ago

A README update would be great, either way works well...

janwerkhoven commented 2 years ago

Alternatively use a template helper which exposes environment flags:

// app/helpers/env.js

import { helper } from '@ember/component/helper';
import ENV from 'foo/config/environment';

export default helper(function env(key) {
  return ENV[key];
});
{{! app/templates/head.hbs }}

{{#if (env 'isProduction')}}
  <link rel="icon" href="{{env 'rootURL'}}assets/favicon.png">
  <link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
{{/if}}