How do I use fontFace with emotion? There is no sr...
# react
i
How do I use fontFace with emotion? There is no src property available:
Copy code
"fontFace" {
    fontFamily = FontFamily(Goldplay)
    fontWeight = fw.unsafeCast<IntegerType>()
    fontStyle = FontStyle.normal
    src = "myfont-400.woff2"
}
t
Issue required 🙂 cc @Sergei Grishchenko
🤔 1
And don’t use
unsafeCast
please We have safe factories for all known properties
Copy code
fontWeight = integer(fw)
i
it requires an integer, the
fw
value that I get here is a numeric string at that point, thats why i used unsafecast...
t
Copy code
fontWeight = integer(fw.toInt())
i
Amazing, thanks! 🙂 waiting for pre.326 ^^
t
Released 🙂
🎉 1
K 1
w
@turansky I am trying to use the fontface function
Copy code
fontFace {
    this.fontFamily = "Apple Chancery"
    this.fontWeight = FontWeight.bold
    this.fontStyle = FontStyle.normal
    this.src = "url(./fonts/Apple_Chancery.tff)"
}

The font is located in my resource/fonts folder. When the page loads, I get a message in the console that the file cannot be loaded. The url is
localhost:8082/fonts/Apple_Chancery.tff

is the source url suppose to be to a website to down load the file or to the a local resource directory for the file? IF a local direcoty, What else needs to be done to retreive the file?
t
Probably you need additional configuration for Webpack resources
Does it work fine in production mode?
w
No, it works the same as development mode. I am know nothing about webpack, or the kotlin gradle syntaxes to work with it. What configuration would I be missing?
t
Your resources must be in the same directory with compiled js file
w
I threw my project into github https://github.com/persa1wb/KJSScratchPad. When you asked me about prod,, I took that to mean the browser{region}run tasks. I am not sure now if that is what you meant. As for getting the resources into the same directory as the compiled js file. Under build/js/packages/kotlin the project js and resources appear there. Is this the directory you were refering to?