使用 PHP 自动将引用的 LESS 文件编译成 CSS

1) Grab Lessphp I placed these files in /www/compilers/lessphp/ for the context of this demo

2) 制作一个我们可以丢弃 LESS 文件的 PHP 脚本.这将处理缓存、编译为 CSS 并将 CSS 作为响应返回.我已将此文件放在 /www/compilers/ 并将其命名为 lessphp.php

2) Make a PHP script that we can throw out LESS files at. This will deal with caching, compiling to CSS and returning the CSS as a response. I have placed this file at /www/compilers/ and called it lessphp.php

大部分代码都在 Lessphp 网站上，除了其中有错误，我在最后添加了响应.

Most of this code was on the Lessphp site, except there were errors in it, and I have added the response at the end.

<?php
require "lessphp/lessc.inc.php";
$file = $_GET["file"];
function autoCompileLess($inputFile, $outputFile) {
    // load the cache
    $cacheFile = $inputFile.".cache";
    if (file_exists($cacheFile)) {
        $cache = unserialize(file_get_contents($cacheFile));
    } else {
        $cache = $inputFile;
    }
    $less = new lessc;
    $less->setFormatter("compressed");
    $newCache = $less->cachedCompile($cache);
    if (!is_array($cache) || $newCache["updated"] > $cache["updated"]) {
        file_put_contents($cacheFile, serialize($newCache));
        file_put_contents($outputFile, $newCache['compiled']);
    }
}
autoCompileLess('../' . $file, '../' . $file . '.css');
header('Content-type: text/css');
readfile('../' . $file . '.css');
?>

这会将 LESS 文件(例如，styles/main.less)编译为缓存文件和 CSS 文件(例如，styles/main.less.css).

This will compile the LESS file (eg, styles/main.less) to a cache file and a CSS file (eg, styles/main.less.css).

3) 添加 mod_rewrite 规则，以便用户请求的任何 LESS 文件都重定向到我们的编译器，并为其提供路径.这被放置在根 .htaccess 文件中.

3) Add a mod_rewrite rule so that any LESS files a user requests are redirected to our compiler, giving it its path. This was placed in the root .htaccess file.

<IfModule mod_rewrite.c>
    RewriteEngine On
    RewriteBase /
    RewriteRule ^([^.]*.less)$ compilers/lessphp.php?file=$1 [R,QSA,L]
</ifModule>

如果您使用的是 WordPress，则需要在其后执行此规则 - 即使 WordPress 在子目录中，它似乎也会覆盖这些规则，并且对于下面存在的引用文件不会发生 LESS 编译(目录明智)WordPress 的 .htaccess 规则.

If you are using WordPress, this rule will need to come after it - even if WordPress is in a sub directory, it seems to overwrite these rules, and LESS compilation will not occur for referenced files which exist below (directory wise) WordPress's .htaccess rules.

4) 您的 LESS 代码应相对于编译器位置进行相对引用.此外，如果有空属性，Lessphp 编译器将失败，例如.背景色:;

4) Your LESS code should be relatively referenced in relation to the compilers location. Additionally, Lessphp compiler will fail if there are empty attributes, eg. background-color: ;

如果一切正常，应该会出现以下情况:

If all is working well, the following should occur:

1. 直接浏览你的LESS文件http://domain.com/styles/main.less

被自动重定向到 http://domain.com/compilers/lessphp?file=styles/main.less

以缩小的 CSS 呈现

Be presented with minified CSS

main.less.css 和 main.less.cache 现在应该与您的 LESS 文件存在于同一目录中

main.less.css and main.less.cache should now exist in the same directory as your LESS file

除非您更新 LESS 文件，否则最后修改日期不应更改

The last modified dates shouldn’t change unless you update your LESS file

这篇关于使用 PHP 自动将引用的 LESS 文件编译成 CSS的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持跟版网！