KSS Styleguide中的元素无法设置样式

Question

我使用kss-node并尝试最简单的项目。它只是使用了快速入门指南中的示例。

css是source/style.css格式的

// Hard rules
//
// Markup: <hr>
//
// Style guide: hard-rule

hr {
  border-top: 5px solid #999;
}

然后我跑

npm-exec kss-node --source source --destination styleguide --css ../source/style.css 

第一个问题是--css选项需要样式向导后面所在位置的相对路径。

但是hr元素看起来还是一样的，而且不是5px厚。该文件包含在html中，但Dev Tools显示应用了"0规则“

Answer 1

它会不会与你在css文件中使用的"//“注释有关？尝试使用预处理器和styles.scss文件作为源文件，然后包含sass生成的styles.css文件，该文件中不会包含无效的"//“注释。

Answer 2

这似乎符合/*的硬性规则

标记：

​

风格指南: hard-rule */ `

https://github.com/rcaracaus/kss-test

Answer 3

我重新阅读了kss-node的文档。推荐的方式似乎是创建一个kss模板并在其中添加样式表。

我拿到了罗伯特的回购并执行了

npm-exec kss-node --init my-template

然后，我将以下行添加到my-template/index.html中

<link rel="stylesheet" href="../source/styles.css">

显然，styles.css文件不会被复制到styleguide目录。

尽管这并没有回答我最初的问题。我觉得它应该在没有自定义模板的情况下工作。但这对我很有效。