css - Less 编译器自己在 url 前加上 ../

标签 css twitter-bootstrap-3 less

我在将 bootstrap less 编译成 css 时遇到问题。

我正在使用带有 Web 编译器扩展的 Visual Studio。

https://visualstudiogallery.msdn.microsoft.com/3b329021-cd7a-4a01-86fc-714c2d05bb6c

定义了以下变量:

@icon-font-path:          "fonts/";
@icon-font-name:          "glyphicons-halflings-regular";

这是使用变量的部分:

@font-face {
  font-family: 'Glyphicons Halflings';
  src: url('@{icon-font-path}@{icon-font-name}.eot');
}

这是生成的 CSS:

@font-face {
  font-family: 'Glyphicons Halflings';
  src: url('../fonts/glyphicons-halflings-regular.eot');
}

问题是 url 以 ../ 为前缀。

这是什么原因造成的,我如何获得没有前缀的 url - fonts/glyphicons-halflings-regular.eot

最佳答案

我已经找到了解决方案,所以如果有人遇到同样的问题,我会在这里发帖。

编辑 compilerconfig.json 并将 relativeUrls 选项设置为 false。 如果未指定,则默认值为 true

  {
    "inputFile": "Bootstrap/less/bootstrap.less",
    "outputFile": "Bootstrap/less/output/bootstrap.css",
    "options": { "relativeUrls": false }
  }

当使用 Web 编译器扩展时,这似乎等同于 lessc --relative-urls

关于css - Less 编译器自己在 url 前加上 ../,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/35968740/

相关文章:

html - 为 sprite 悬停调整 CSS 和 HTML

html - 如何在不覆盖内容的情况下粘贴页脚?

javascript - 在 Angularjs 中为类生成动态值

css - 自定义帖子的 div 边距太多

CSS 转换错误

jquery - 如何在嵌套面板组的引导折叠中滑动到面板标题顶部

html - 使用 Bootstrap 激活选项卡

css - LESS 在客户端运行的最低浏览器版本

css - 如何用 grunt 递归编译 less/sass 文件

php - 如何在我的 localhost php 服务器上安装 less