3

I'm trying to add some font libraries using Yarn, like this one: https://www.npmjs.com/package/fontsource-poppins.

They're working fine in development but not in production.

application.js

require("@rails/ujs").start()
require("turbolinks").start()
require("@rails/activestorage").start()
require("channels")
require("fontsource-dancing-script")
require("fontsource-poppins")

application.css

 @import "fontsource-dancing-script/600.css";
 @import "fontsource-poppins/400.css";
 @import "fontsource-poppins/300.css";
 @import "fontsource-poppins/200.css";
 @import "fontsource-poppins/100.css";

package.json

{
  "name": "xxxx",
  "private": true,
  "dependencies": {
    "@rails/actioncable": "^6.0.0",
    "@rails/actiontext": "^6.0.3-4",
    "@rails/activestorage": "^6.0.0",
    "@rails/ujs": "^6.0.0",
    "@rails/webpacker": "4.3.0",
    "fontsource-dancing-script": "^3.0.5",
    "fontsource-poppins": "^3.0.10",
    "trix": "^1.2.0",
    "turbolinks": "^5.2.0"
  },
  "version": "0.1.0",
  "devDependencies": {
    "webpack-dev-server": "^3.11.0"
  }
}

I'm not getting any errors during deployment, but when I check the sources tab in devtools, I see that the required files are missing.

jonrsharpe
  • 115,751
  • 26
  • 228
  • 437
gagarin
  • 31
  • 2
  • Do you have any Gems for these in your Gemfile? If so, maybe the Gems are limited to the deployment environment? – John Hanlon Nov 25 '20 at 20:30
  • @JohnHanlon No, I just installed them with `yarn add fontsource-poppins` etc. – gagarin Nov 25 '20 at 20:33
  • It sounds that Webpack(er) needs to compile the fonts (.ttf, .wofw, .svg) files manually as assets. What do you think about https://stackoverflow.com/questions/58702665/how-do-i-load-local-fonts-with-rails-webpacker – Ccastillop Nov 25 '20 at 23:15

0 Answers0