title: Not all free font awesome fonts loading in angular 2+ project
body: <p>I am using several free Font Awsome icons throughout my project. The majority load just fine for example</p>
  <pre><code>&lt;i class=&quot;fa fa-search&quot;&gt;&lt;/i&gt;
  </code></pre>
  <p>shows a magnifying glass icon however</p>
  <pre><code>&lt;i class=&quot;fa fa-sync&quot;&gt;&lt;/i&gt;
  </code></pre>
  <p>does not show anything. Both are listed as &quot;Free&quot; <a href="https://fontawesome.com/icons?d=gallery&amp;q=refresh&amp;m=free" rel="nofollow noreferrer">on the Font Awsome site</a></p>
  <p>In my angular.sjon file I have the following reference to Font Awesome;</p>
  <pre><code>        &quot;styles&quot;: [
            &quot;src/styles.css&quot;,
            &quot;node_modules/bootstrap/dist/css/bootstrap.min.css&quot;,
            &quot;node_modules/font-awesome/scss/font-awesome.scss&quot;
          ],
  </code></pre>
  <p>In my package-lock.json file;</p>
  <pre><code>&quot;font-awesome&quot;: {
    &quot;version&quot;: &quot;4.7.0&quot;,
    &quot;resolved&quot;: &quot;https://registry.npmjs.org/font-awesome/-/font-awesome-4.7.0.tgz&quot;,
    &quot;integrity&quot;: &quot;sha1-j6jPBBGhoxr9B7BtKQK7n8gVoTM=&quot;
  },
  </code></pre>
  <p>and in my package.json file;</p>
  <pre><code>&quot;font-awesome&quot;: &quot;^4.7.0&quot;,
  </code></pre>
  <p>Why can I not see the icon I am expecting?</p>
  <p>I'm relatively new to both Angular and Font Awesome, I would be greatful(i.e. would +1) for guidance if my approach is generally wrong.</p>