Question

我尝试使用lessc为nodejs编译少2个文件。

我的文件按此顺序排列：

lessc文件位于 C：\ test \ less \ bin ，test.less和all.less文件位于 C：\ test \ css

我的lessc命令行是：

lessc --include-path="..\..\test" "C:\test\css\all.less" "C:\test\css\all.css"

我的all.less文件如下：

@import: ".\test.less";

.transition(@transition) {
    weight: 1px+1em;
  -webkit-transition: @transition;
-moz-transition: @transition;
-o-transition: @transition;
transition: @transition;
}
.opacity(@opacity) {
  opacity: @opacity / 100;
  filter: ~"alpha(opacity=@{opacity})";
}

a {
.transition(all 0.4s) ;
&:hover {
  .opacity(70);
  .testClass;
  }
}

// Selector interpolation only works in 1.3.1+. Try it!
@theGoodThings: ~".food, .beer, .sleep, .javascript";

@{theGoodThings} {
  font-weight: bold;
  size: 50px;
  filter: e("ms:alwaysHasItsOwnSyntax.For.Stuff()");
}

和test.less文件如下：

.testClass {
    content: replace("Hello, Mars?", "Mars\?", "Earth!");
    content: replace("One + one = 4", "one", "2", "gi");
    content: replace('This is a string.', "(string)\.$", "new $1.");
    content: replace(~"bar-1", '1', '2');
}

问题是当我运行命令时，我得到的只是错误，解释.testClass是未定义的

NameError: .testClass is undefined in C:\test\css\all.less on line 19, column 3:

18   .opacity(70);
19   .testClass;
20   }

我尝试任何参数，甚至尝试调试lessc代码，但无法提出任何解决方案。似乎在编译期间忽略了all.less文件中的@import of test.less文件，并且无法在test.less文件中找到.testClass类。

我错过了什么？我使用了错误的论点吗？

Answer 1

<强>答案：

我发现了问题。在all.less文件中，我导入的test.less文件是

.flip-container { float:left; margin: 7.5px; } /* entire container, keeps perspective */ .flip-container { perspective: 1000px; } /* flip the pane when hovered */ .flip-container:hover .flipper, .flip-container.hover .flipper { transform: rotateY(180deg); } .flip-container, .front, .back { width: 210px; height: 210px; } /* flip speed goes here */ .flipper { transition: 0.6s; transform-style: preserve-3d; position: relative; } /* hide back of pane during swap */ .front, .back { backface-visibility: hidden; position: absolute; top: 0; left: 0; } /* front pane, placed above back */ .front { z-index: 2; /* for firefox 31 */ transform: rotateY(0deg); } /* back, initially hidden pane */ .back { transform: rotateY(180deg); }

应该是什么时候（注意缺少＆＃39;：＆＃39;）

@import: ".\test.less"

使用lessc编译.less文件

1 个答案: