ruby-on-rails - Rails : Installing font-awesome in Rails 6. 0.0-rc1 与 webpacker 和 yarn

标签 ruby-on-rails ruby webpack yarnpkg

我正在尝试通过 yarn 安装 FontAwesome通过做yarn add @fontawesome/fontawesome-free ,然后将其添加到我的 application.scss :

$fa-font-path: '~@fortawesome/fontawesome-free-webfonts/webfonts';
@import '~@fortawesome/fontawesome-free-webfonts/scss/fontawesome';
@import '~@fortawesome/fontawesome-free-webfonts/scss/fa-solid';

我已经尝试在 application.scss 中写了几件事我通过互联网看到的,但它们都不起作用,因为我收到以下错误:
Sass::SyntaxError in Pages#index
Showing /Users/foo/dev/project/app/views/layouts/application.html.erb where line #9 raised:

File to import not found or unreadable: ~@fortawesome/fontawesome-free-webfonts/scss/fontawesome.
Load paths:
  /Users/foo/dev/project/app/assets/images
  /Users/foo/dev/project/app/assets/javascripts
  /Users/foo/dev/project/app/assets/stylesheets
  /Users/foo/dev/project/vendor/bundle/ruby/2.5.0/gems/coffee-rails-5.0.0/lib/assets/javascripts
  /Users/foo/dev/project/vendor/bundle/ruby/2.5.0/gems/actioncable-6.0.0.rc1/app/assets/javascripts
  /Users/foo/dev/project/vendor/bundle/ruby/2.5.0/gems/activestorage-6.0.0.rc1/app/assets/javascripts
  /Users/foo/dev/project/vendor/bundle/ruby/2.5.0/gems/actionview-6.0.0.rc1/lib/assets/compiled
  /Users/foo/dev/project/node_modules

非常感谢您的帮助!

最佳答案

您需要删除 ~在您的导入开始时签名,它应该可以正常工作。

它应该是这样的:

$fa-font-path: '@fortawesome/fontawesome-free-webfonts/webfonts';
@import '@fortawesome/fontawesome-free-webfonts/scss/fontawesome';
@import '@fortawesome/fontawesome-free-webfonts/scss/fa-solid';

希望能帮助到你 :)

关于ruby-on-rails - Rails : Installing font-awesome in Rails 6. 0.0-rc1 与 webpacker 和 yarn ,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/55989717/

相关文章:

ruby-on-rails - 使用 Stripe for rails 检查充电是否成功

jquery - 如何在Rails中使用下拉菜单和ajax过滤数据

ruby-on-rails - 选择不显示所选值

ruby-on-rails - 载波,Rails 4; Errno::ENOENT(无此文件或目录-标识)

ruby-on-rails - ruby on rails 连接两个事件记录对象

typescript - TsconfigPathsPlugin 类型与 webpack 5 不兼容

ruby-on-rails - 我必须运行 rake db :test:load each time manually before runnings tests?

ruby - 什么是 SSH 转发?

javascript - Webpack 4 - 没有正确缩小 css 和正确 uglify js

javascript - Vue - 将相同的数据从一个组件传递到多个组件