Storybook: Unable to load google font via link tag

Created on 6 Apr 2017  路  4Comments  路  Source: storybookjs/storybook

Hi! I'm really enjoying using this library but I'm having a small issue loading fonts. In my project I load open sans from google fonts via a link tag in head. From the docs it seems like putting the same link tag in head.html should work. Is there anything else I need to do to load an external font? Thanks for the help!

question / support

All 4 comments

Hey @qualitydixon

Is your project on a public repo, or could you perhaps show us what your config and head.html looks like?

Thanks for the reply! I can make a public repo tomorrow. In the meantime, my head.html is just one line:

<link href="https://fonts.googleapis.com/css?family=Open+Sans:300,400,600" rel="stylesheet" type="text/css" />

And my config.js is this:

import { configure } from '@kadira/storybook';

function loadStories() {
  require('../stories');
}

configure(loadStories, module);

Am I missing something?

The issue was with how I apply fonts on a project level so that in the context of storybook there were not applied. Thanks for the help.

@qualitydixon Can you share how you resolved the issue? I'm experiencing the same challenge of applying a webfont to my storybook components.

Was this page helpful?
0 / 5 - 0 ratings