如何設置圖像寬度的解析路徑？

Question

我有一個LESS文件引用了絕對位置（它需要是絕對的或者grunt-usemin不會正確解析它），但是這會導致編譯器在處理image-width()時無法解析圖像。

/client/app/app.less

// logo is located at /client/assets/images/ but "/client" is the 
// web root, which is why the absolute reference is "/assets/images" 
@logo-url: '/assets/images/web-header-111_253x45.gif'; 
@logo-width: image-width(@logo-url); 
@logo-height: image-height(@logo-url); 

.web-header { 
    width: @logo-width; 
    height: @logo-height; 
    background: url(@logo-url); 
} 

/gruntfile.js

grunt.initConfig({ 

    /* TRIMMED */ 

    less: { 
     options: { 
     }, 
     server: { 
     files: [{ 
      src: ['client/app/app.less'], 
      dest: '.tmp/app/app.css' 
     }] 
     } 
    } 

    /* TRIMMED */ 
    }); 

以上將拋出下面的生成錯誤：

Warning: Running "less:server" (less) task 
>> RuntimeError: error evaluating function `image-width`: ENOENT, no such file or directory 'C:\git\www-project\client\app\assets\images\web-header-111_2 
53x45.gif' in client\app\app.less on line 26, column 14: 
>> 25 @logo-url: '/assets/images/web-header-111_253x45.gif'; 
>> 26 @logo-width: image-width(@logo-url); 
>> 27 @logo-height: image-height(@logo-url); 
Warning: Error compiling client/app/app.less Use --force to continue. 

Aborted due to warnings. 

Question：我可以設置什麼來設置圖像寬度（...）相對於C：\ git \ www-project \ client目錄而不是包含app.less的目錄？

Answer 1

如果我同時設置絕對URL路徑&計算相對文件路徑，那麼可以解決image-width(...)路徑沒有問題。

// logo is located at /client/assets/images/ but "/client" is the 
// web root, which is why the absolute reference is "/assets/images" 
@root: '..'; 
@logo-url: '/assets/images/web-header-111_253x45.gif'; 
@logo-path: '@{root}@{logo-url}'; 
@logo-width: image-width(@logo-path); 
@logo-height: image-height(@logo-path); 

.web-header { 
    width: @logo-width; 
    height: @logo-height; 
    background: url(@logo-url); 
}