0

我刚刚在我的 Rails 应用程序中从 Semantic UI 切换到社区维护的 Fomantic UI,并在使用npm 包sass rails gem时遇到两个模糊错误之一。

  1. 使用 npm 包,我可以Less::Error unmatched '/*'随时stylesheet_link_tags在文档头中加载 fomantic 资产。通过以下两个文件将 fomantic 样式和 js 拉入我的项目中:

    应用程序.css.scss

    *= require 'semantic-ui/src/semantic

    应用程序.js

    //= require semantic-ui/dist/semantic

    我注意到当我从semantic-ui/dist. 但是,这样做排除了很多。图标停止工作。存储的相关文件semantic-ui/srcsemantic.less。存储在其中的相关文件semantic-ui/distsemantic.min.css(我不需要,除了刚才切换东西来解决这个问题时)和semantic.min.js(我确实需要)。

    同样,如果我需要在 中缩小样式表,它“工作”,如果我需要在 .less 文件中semantic-ui/dist不会“工作” 。这是semantic.less还是其他生成的导入文件之一的问题?semantic-ui/src

  2. 使用 sass rails gem,我得到一个 Sass::SyntaxError Invalid CSS after "i.icon.stopwatch.": expected class name, was "20:before"

    查看源代码,我看到了许多这样的声明:i.icon.stopwatch.20:before {content: "\f96f";}.

    为什么会抛出错误?

这是否意味着 npm 包和 gem 有无效的 css 或者我的应用程序编译不正确?我对使用 npm 包或 gem 没有意见,我只想让它工作。当我使用旧的语义 UI 时,一切正常。我非常困惑,非常感谢您的帮助。谢谢!

4

1 回答 1

1
  1. 使用 npm 包

自述文件似乎不支持lessSprockets

Sprockets ... 允许您使用 CoffeeScript、Sass 和 SCSS 等语言编写资产。

所以你不能使用/src目录。

您可以尝试import /dist

# application.css.scss
import 'semantic-ui/dist/semantic'
  1. 使用 sass rails gem

Thats a bug from Fomantic-UI already fixed, but have not been updated to Fomantic-UI-SASS

于 2021-03-01T06:24:12.457 回答