webpacker setup for bulma and fontawesome
1. yarn add on bash
yarn add @fortawesome/fontawesome-free yarn add @fortawesome/free-brands-svg-icons yarn add @fortawesome/free-solid-svg-icons yarn add bulma
2. Added bulma, fa link in application.scss
# app/javascript/stylesheets/application.scss @import '~bulma'; $fa-font-path: '~@fortawesome/fontawesome-free/webfonts'; @import '~@fortawesome/fontawesome-free/scss/fontawesome'; @import '~@fortawesome/fontawesome-free/scss/solid'; // fas prefix @import '~@fortawesome/fontawesome-free/scss/brands'; // fab prefix # https://gist.github.com/ro31337/fde256c19074356e4f847a48f696658c
3. Delete stylesheet_link_tag in application.html.erb
<% stylesheet_link_tag... to
4. Add link application.scss in application.js
# app/javascript/packs/application.js import '../stylesheets/application.scss' # import '../stylesheets/your scss or sass or css' # https://github.com/rails/webpacker/blob/master/docs/css.md
4. Compile on bash
# bundle exec npm rebuild node-sass # https://www.changwoo.org/x1wins@changwoo.net/2020-11-28/Error-Missing-binding-linux-x64-72-binding-node-52558689e9 # bundle exec rails webpacker:compile # docker-compose docker-compose run --no-deps web bundle exec npm rebuild node-sass && docker-compose run --no-deps web bundle exec rails webpacker:compile