Use fonts from static folder to avoid hashing is not working

GrabarzUndPartner / nuxt-font-loader-strategy

Helps to load fonts and activate them by preloading.

https://grabarzundpartner.github.io/nuxt-font-loader-strategy/

MIT License

64 stars 1 forks source link

Use fonts from static folder to avoid hashing is not working #154

Closed Tragio closed 3 years ago

Tragio commented 3 years ago

Hello!

Thank you very much for this plugin and all the work.

If we use '@/assets/fonts/font-a-regular' as stated in the documentation, it will be hashed in each build. This means that it will never be cached properly. Fonts rarely change, and if they change we can easily update their filename.

To avoid this, the fonts should be located in the /static/ folder. However, when I use for example this path src: '/static/assets/fonts/montserrat-v14-latin-700' the plugin does not work properly as it can't locate and preload the plugin.

Would be possible to check this?

Thank you once again and have a great year!

ThornWalli commented 3 years ago

Hi :)

It should work via the static alias.

https://nuxtjs.org/docs/2.x/configuration-glossary/configuration-alias

{
  fileExtensions: ['woff2', 'woff'],
  fontFamily: 'Roboto Slab',
  fontFaces: [
    {
      preload: true,
      src: 'static/fonts/roboto-slab-v11-latin/roboto-slab-v11-latin-regular',
      fontWeight: 400,
      fontStyle: 'normal'
    },
    {
      preload: true,
      src: 'static/fonts/roboto-slab-v11-latin/roboto-slab-v11-latin-700',
      fontWeight: 700,
      fontStyle: 'normal'
    }
  ]
}

Tragio commented 3 years ago

@ThornWalli thank you for your reply. Yes, I'm using it in that way but it is not working. 🤔

https://domain.com/static/assets/fonts/montserrat-v14-latin-regular.woff - Failed to load resource: the server responded with a status of 404 ()

[
      'nuxt-font-loader-strategy',
      {
        fonts: [
          {
            fontFamily: 'Montserrat',
            fontFaces: [
              {
                preload: true,
                localSrc: ['Montserrat Regular', 'Montserrat-Regular'],
                src: 'static/assets/fonts/montserrat-v14-latin-regular',
                fontWeight: 400,
                fontStyle: 'normal',
                fontDisplay: 'fallback',
              },
            ],
          },
        ],
      },
    ],

ThornWalli commented 3 years ago

Is the Assets folder in the Static directory?

Tragio commented 3 years ago

@ThornWalli yes, it is, for a second my brain frozen 😅

static