Question

我正在使用无点（我认为是1.4.1）而且我的.less文件中有这个

#btnSearch { background-image: data-uri('/images/btnSearch.png'); }

它抛出了这个错误：

Data-uri函数无法在文件'/css/less/site.less'中的第140行读取文件'/images/btnSearch.png'。

如果我使用data-uri更改url，则可以使用（以证明该文件存在）我还尝试了相对路径（../../images/btnSearch.png）以及其他一些JPEG图像。

Answer 1

GitHub上的data-uri函数的代码在异常处理中有以下注释。

//这比检查文件是否存在更为通用

//由于安全权限等其他原因，它可能会失败

我会检查没有权限问题，因为Dotless需要读取图像以将其转换为base64

Answer 2

在使用完全合格的本地（文件系统）路径之后，我确实让它工作。

e.g。

。无意见的输入

body {
#divTest {
        background-image: data-uri('C:\Users\Ben\Source\Repos\ASPNET\ASPNET\Content\accept.png');
    }
}

<强>输出

.#divTest {
  border: solid 1px blue;
  background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAABGdBTUEAAK/INwWK6QAAABl0RVh0U29mdHdhcmUAQWRvYmUgSW1hZ2VSZWFkeXHJZTwAAAKfSURBVDjLpZPrS1NhHMf9O3bOdmwDCWREIYKEUHsVJBI7mg3FvCxL09290jZj2EyLMnJexkgpLbPUanNOberU5taUMnHZUULMvelCtWF0sW/n7MVMEiN64AsPD8/n83uucQDi/id/DBT4Dolypw/qsz0pTMbj/WHpiDgsdSUyUmeiPt2+V7SrIM+bSss8ySGdR4abQQv6lrui6VxsRonrGCS9VEjSQ9E7CtiqdOZ4UuTqnBHO1X7YXl6Daa4yGq7vWO1D40wVDtj4kWQbn94myPGkCDPdSesczE2sCZShwl8CzcwZ6NiUs6n2nYX99T1cnKqA2EKui6+TwphA5k4yqMayopU5mANV3lNQTBdCMVUA9VQh3GuDMHiVcLCS3J4jSLhCGmKCjBEx0xlshjXYhApfMZRP5CyYD+UkG08+xt+4wLVQZA1tzxthm2tEfD3JxARH7QkbD1ZuozaggdZbxK5kAIsf5qGaKMTY2lAU/rH5HW3PLsEwUYy+YCcERmIjJpDcpzb6l7th9KtQ69fi09ePUej9l7cx2DJbD7UrG3r3afQHOyCo+V3QQzE35pvQvnAZukk5zL5qRL59jsKbPzdheXoBZc4saFhBS6AO7V4zqCpiawuptwQG+UAa7Ct3UT0hh9p9EnXT5Vh6t4C22QaUDh6HwnECOmcO7K+6kW49DKqS2DrEZCtfuI+9GrNHg4fMHVSO5kE7nAPVkAxKBxcOzsajpS4Yh4ohUPPWKTUh3PaQEptIOr6BiJjcZXCwktaAGfrRIpwblqOV3YKdhfXOIvBLeREWpnd8ynsaSJoyESFphwTtfjN6X1jRO2+FxWtCWksqBApeiFIR9K6fiTpPiigDoadqCEag5YUFKl6Yrciw0VOlhOivv/Ff8wtn0KzlebrUYwAAAABJRU5ErkJggg==");
}

查看DataUriFunction中的源代码，很明显该函数不需要完全限定的Web地址，声明＆＃34;文件名必须是本地文件＆＃34;，但这会让人感到困惑，因为lesscss.org在他们的文档中提供following example

Example: data-uri('../data/image.jpg');

我说这是一个错误，当然看起来并不是最佳的，但没有踩到dotless.Core.Parser.Functions.DataUriFunction的来源我无法确定。

你如何在无点的数据中使用数据？

2 个答案: