Preact-cli: Adding Analytics & Web Fonts

Created on 4 Aug 2017  路  1Comment  路  Source: preactjs/preact-cli

Hi,

I need to add analytics (Google Analytics & Mixpanel) as well as web fonts to my app created with preact cli.

Analytics

I need to place a snippet into the <head>, how do I do this?

Web fonts

I tried placing woff/woff2 files into the src/lib or src/assets folder and then load them in my src/style/helper.scss:

@font-face {
  font-family: 'myfont';
  src: url('../lib/font.woff2') format('woff2'),
        url('../lib/font.woff') format('woff');
  font-weight: normal;
  font-style: normal;
}

This works initially but when I include the helper.scss in my component's style.scss I get:

Module not found: Error: Can't resolve '../lib/font.woff2' in '/Users/xxx/test/src/components/header'

Another option would be to load the Webfont in <head> tag similar but then I have the same problem as with the Analytics snippets: Where do I place it?

Most helpful comment

To modify the head, I would use a custom template. Notes on how to change it are at the bottom of the trade.

I would place fonts in static and then use absolute urls to link to them; e.g./static/font.woff

>All comments

To modify the head, I would use a custom template. Notes on how to change it are at the bottom of the trade.

I would place fonts in static and then use absolute urls to link to them; e.g./static/font.woff

Was this page helpful?
0 / 5 - 0 ratings