最近我开始使用 LESS 为多个项目创建通用 CSS。由于它将在多个项目中使用,它作为 git 子模块包含在我当前的项目中,所有内容都放在一个文件夹中。所以整个项目文件是这样的:
myProject
app
//this is the code of my project
public
css
//storing some third party CSS like font awesome
fonts
//font files of third part CSS
myCSS
less
myStyle.less
fonts
myFont.ttf
Some Other files and folders
我使用 laravel 4.2 作为框架。起初,我开始使用 less.js 在运行时编译 LESS 文件,一切正常。以下是包含字体的 LESS。
@font-face{
font-family: OpenSans-Regular;
src: url('../fonts/myFont.ttf');
}
但是,我发现在一些老机器和移动设备上,处理速度不够快,会出现一个小瞬间,元素显示没有样式。所以,为了解决这个问题,我决定用LESS PHP在服务器端编译文件。以下是我放在模板文件顶部的内容。(每隔一页将包括以下行)
<head>
<?php
require "lessc.inc.php";
$less = new lessc;
echo $less->compileFile("myStyle.less");
?>
//some other js and css to include
</head>
<body>
//page contents
</body>
它编译成功,但由于 LESS 直接编译到页面,当我的页面有 url 时,
http://domain.com/public/myController/myPage/
它将搜索字体文件
http://domain.com/public/fonts/myFont.tff
它应该在哪里
http://domain.com/public/myCSS/fonts/myFont.tff
如何使用 PHP 正确编译 LESS 文件?我不想更改 LESS 文件中的路径或将 LESS 文件放在子模块文件夹(即 myCSS)之外,因为此样式文件将在许多其他项目中重复使用。我想在运行时编译,因为 LESS 文件在开发过程中仍会迅速更改。