在我的 rails 应用程序中 Less::Error `unmatched '/*'`/ Sass::SyntaxError 的原因

Question

我刚刚在我的 Rails 应用程序中从 Semantic UI 切换到社区维护的 Semantic UI，并且在使用 npm package or the sass rails gem 时出现两个模糊错误之一.

使用 npm 包，只要 stylesheet_link_tags 等开始在文档头部加载语义资产，我就会得到 Less::Error unmatched '/*'。通过以下两个文件将语义样式和js拉入我的项目：

application.css.scss

*= require 'semantic-ui/src/semantic

application.js

//= require semantic-ui/dist/semantic

我注意到当我从 semantic-ui/dist 加载样式表和 js 时它起作用了。但是，这样做排除了很多。图标停止工作。 semantic-ui/src中存储的相关文件是semantic.less。存储在 semantic-ui/dist 中的相关文件是 semantic.min.css（我不需要它，除了刚才切换来解决这个问题）和 semantic.min.js（我确实需要）。

同样，如果我需要 semantic-ui/dist 中的缩小样式表，它“有效”，如果我需要 semantic.less，它就“无效” semantic-ui/src 中的文件。这是 semantic.less 或其他生成的导入文件之一的问题吗？
有了sassrailsgem，我得到了Sass::SyntaxErrorInvalid CSS after "i.icon.stopwatch.": expected class name, was "20:before".

查看 source，我看到了一些这样的声明：i.icon.stopwatch.20:before {content: "\f96f";}。

为什么会抛出错误？

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

Answer 1

似乎 Sprockets 不支持来自 README

的 less

Sprockets ... allows you to write assets in languages like CoffeeScript, Sass and SCSS.

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

你可以试试 import /dist:

# application.css.scss
import 'semantic-ui/dist/semantic'

这是 Fomantic-UI already fixed, but have not been updated to Fomantic-UI-SASS

的错误

cause of Less::Error `unmatched '/*'`/ Sass::SyntaxError in my rails app