Froala 字体真棒工具栏图标显示为正方形

Question

时不时地，我什至不知道从哪里开始调试，因为我已经尝试了很多东西，以至于我不确定什么有效，什么从来没有起作用。

问题：当我在我的应用程序中加载 Froala 文本编辑器时，编辑器加载正常，通过编辑器提交的内容甚至保存。但是工具栏图标（Font Awesome 图标）都显示为正方形。

我试过的：

froala 文档说我应该将所有这些 "require" 写入 application.css 文件中，所以我尝试将我的 application.css.scss 更改为 application.css 并且它起作用了。但是我还有其他 sass 文件需要导入到我的应用程序文件中，这就是为什么我将它作为 application.css.scss
我使用 Froala Gem 在项目中安装了 Froala。编辑器正在初始化，这意味着 require froala_editor.min.css 中的要求正在运行。这不应该意味着我的 require font-awesome 应该工作并且工具栏中的图标应该正确显示吗？
我也试过将 Font Awesome cdn 直接添加到应用程序布局中，但这似乎没有任何改变。
我尝试过重置缓存并使用不同的浏览器。

这是一个与非常相似的问题，但我认为我正在做我应该做的一切来加载超棒的字体图标，所以我不确定我哪里出错了！

提前感谢您的帮助，如果我可以提供任何其他信息，请告诉我！

更新：我正在使用 link 中的 froala v2，遵循以下说明：https://www.froala.com/wysiwyg-editor/docs/framework-plugins/rails

application.css.scss:

/*
 * This is a manifest file that'll be compiled into application.css, which will include all the files
 * listed below.
 *
 * Any CSS and SCSS file within this directory, lib/assets/stylesheets, vendor/assets/stylesheets,
 * or any plugin's vendor/assets/stylesheets directory can be referenced here using a relative path.
 *
 * You're free to add application-wide styles to this file and they'll appear at the bottom of the
 * compiled file so the styles you add here take precedence over styles defined in any other CSS/SCSS
 * files in this directory. Styles in this file should be added after the last require_* statement.
 * It is generally better to create a new file per style scope.
 *
 *= require_self
 *= require froala_editor.min.css
 *= require froala_style.min.css
 *= require font-awesome
 *= require plugins/char_counter.min.css
 *= require plugins/code_view.min.css
 *= require plugins/colors.min.css
 *= require plugins/emoticons.min.css
 *= require plugins/file.min.css
 *= require plugins/fullscreen.min.css
 *= require plugins/image_manager.min.css
 *= require plugins/image.min.css
 *= require plugins/line_breaker.min.css
 *= require plugins/quick_insert.min.css
 *= require plugins/table.min.css
 *= require plugins/video.min.css
 */

Answer 1

我将错误追溯到我写的 css 以将 <body> 的字体系列设置为自定义字体系列。当我删除它时，方块开始正常显示！我假设发生这种情况是因为超棒的字体图标不知道如何在任何其他字体系列中显示图标，而不是为它创建的字体系列？

如果有人能给我一个清晰的解释那会很棒但是如果您遇到任何类似的问题请尝试此故障排除！

Froala 字体真棒工具栏图标显示为正方形

Froala Font Awesome Toolbar Icons Shown As Squares

css

icons

ruby-on-rails

font-awesome

froala