Discovery on best way to import USWDS images and fonts

[annekainicUSDS]

Right now, Vets.gov and the VA design system imports the images and fonts from USWDS directly, by coping all of the files into an assets directory. This is what I've done temporarily for USWDS as well. There may be a better solution though; look into webpack handling this potentially.

[jcmeloni-usds]

So (ignore if this is too much of a tangent) is uswds in the package.json not really fully useful if we have to manually copy things anyway? Or is it that the package puts things in weird places and it's too much work to remap where those places are so we just manually copy them over?

[annekainicUSDS]

These are good questions that I need to answer when looking into this ticket more :) For expediency I just copied what vets.gov was doing to get the starter-app working, but definitely want to find a better long-term solution

[jcmeloni-usds]

haha oops, my bad?

[annekainicUSDS]

That's okay! Wasn't clear from the description

[annekainicUSDS]

Another problem to look into here: One of the fonts that is used in our forms is imported in a font faces file in the VA design system: https://github.com/department-of-veterans-affairs/design-system/blob/master/src/sass/base/_b-font-faces.scss. This font is copies into vets-website under the assets/ directory, and then this directory is redirected to / in the build script: https://github.com/department-of-veterans-affairs/vets-website/blob/master/script/build.js#L526. When the stylesheet looks for the font, it will look at /font/.... This is a problem because in us-forms-system we're not redirecting our fonts to the base path, so the url that is specified in the font-faces file from VA design can't be found.

As a temporary measure, I've created a different version of the font faces file that changes the path to be relative to the directory it's in, and then copied those fonts into lib/fonts, but would like to find a better long-term solution for this. PR that makes these changes is here: #81

[jcmeloni-usds]

@annekainicUSDS @ju-liem do we need a new ticket to reference the current state, and close this since a bunch of work has happened on it? just want to keep ducks in a row. 🦆 🦆 🦆

[annekainicUSDS]

I'd like to keep this ticket open since it's slightly different from the work I've been doing to refactor the scss (haven't specifically addressed USWDS issues yet, have been focusing on pulling out VA design system styles).

[jcmeloni-usds]

@annekainicUSDS @fatima-gov Is there a tl;dr on what's happened with this or is the reference to #152 the most accurate? Thanks!

[annekainicUSDS]

I haven't looked at this ticket since I last commented, so no new information from me :) it's not high priority as far as I see it. Basically I believe there to be a better way to import USWDS images and fonts from how we are currently doing it, but what we have now works. Perhaps this is something we can revisit with the 2.0 upgrade?