rails / dartsass-rails

Integrate Dart Sass with the asset pipeline in Rails
MIT License
206 stars 42 forks source link

Can't find stylesheet to import: @import "font-awesome" #59

Open dima4p opened 2 months ago

dima4p commented 2 months ago

I have met a problem to use the gem font-awesome-rails.

The command rails dartsass:build produces an error.

Error: Can't find stylesheet to import.
  ╷
2 │ @import "font-awesome"
  │         ^^^^^^^^^^^^^^
  ╵
  app/assets/stylesheets/application.scss 2:9  root stylesheet
bin/rails aborted!
Command failed with exit 65: /usr/local/rvm/gems/ruby-3.2.3@tv/gems/dartsass-rails-0.5.0/lib/tasks/../../exe/dartsass

I suppose the problem is that the file to be included with @import "font-awesome" from font-awesome-rails-4.7.0.8/app/assets/stylesheets/font-awesome.css.erb') is of the format .erb and therefore can not be parsed:

$ bec
Loading development environment (Rails 7.2.0.alpha)
3.2.3 :001 > require 'sass-embedded'
 => true
3.2.3 :002 > Sass.compile('/usr/local/rvm/gems/ruby-3.2.3@tv/gems/font-awesome-rails-4.7.0.8/app/assets/stylesheets/font-awesome.css.erb')
Error: expected "(".
   ╷
14 │   src: url('<%= font_path('fontawesome-webfont.eot') %>');
   │                                                   ^
   ╵
  ../../../../font-awesome-rails-4.7.0.8/app/assets/stylesheets/font-awesome.css.erb 14:51  root stylesheet

I do not know, of which gem is the bug. The candidates are:

The whole project that demonstrates the bug is here.

b-nik commented 2 months ago

I'm using this gem personally: https://github.com/FortAwesome/font-awesome-sass

And I also had to set the font path variable when importing it:

@use "font-awesome" with (
  $fa-font-path: "font-awesome"
);
dima4p commented 2 months ago

And I also had to set the font path variable when importing it:

@use "font-awesome" with (
  $fa-font-path: "font-awesome"
);

Thank you very much. But I can not understand where the code above should be placed? I got the message:

Error: This variable was not declared with !default in the @used module.
  ╷
3 │   $fa-font-path: "font-awesome"
  │   ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
  ╵