Font awesome 5 sage 8.6

sage
1

currently getting blank squares from font awesome in sage 8.6

main scss
$fa-font-path: ‘…/fonts’;

@import "../../bower_components/Font-Awesome/scss/fontawesome.scss";

overides

{
  "name": "sage",
  "homepage": "https://roots.io/sage/",
  "authors": [
    "Ben Word <ben@benword.com>"
  ],
  "license": "MIT",
  "private": true,
  "dependencies": {
    "bootstrap": "^4.0.0",
    "Font-Awesome": "https://github.com/FortAwesome/Font-Awesome.git#^5.11.2"
  },
  "overrides": {
    "bootstrap": {
      "main": [
        "./scss/bootstrap.scss",
        "./dist/js/bootstrap.bundle.js"
      ]
    },
    "Font-Awesome" : {
      "main": [
        "./scss/fontawesome.scss",
        "./scss/fa-brands.scss",
        "./webfonts/fa-brands-400.eot",
        "./webfonts/fa-brands-400.svg",
        "./webfonts/fa-brands-400.ttf",
        "./webfonts/fa-brands-400.woff",
        "./webfonts/fa-brands-400.woff2",
        "./scss/fa-regular.scss",
        "./webfonts/fa-regular-400.eot",
        "./webfonts/fa-regular-400.svg",
        "./webfonts/fa-regular-400.ttf",
        "./webfonts/fa-regular-400.woff",
        "./webfonts/fa-regular-400.woff2",
        "./scss/fa-solid.scss",
        "./webfonts/fa-solid-900.eot",
        "./webfonts/fa-solid-900.svg",
        "./webfonts/fa-solid-900.ttf",
        "./webfonts/fa-solid-900.woff",
        "./webfonts/fa-solid-900.woff2"
      ]
    }
  }
}

html
<i class="fa fa-camera-retro"></i>

after all this just get blank square cant see whats incorrect