2012-01-24 7 views
2

私はLESSについて聞いたとき、もともとはCSSファイルに事前処理されていると思っていたので、ブラウザはLESSファイルではなくCSSファイルに遭遇しました。LESSプラグインはどのようにPlay Frameworkで動作しますか?

しかし、Play FrameworkのLESSプラグインを使用して、私のChromeブラウザが実際にはlessファイルを読み込んで解釈することがわかりました。 LESSはすべての主要なブラウザでサポートされていると主張しています。現代のウェブサイトは、あまりレッスンしていないファイルを提供するのでしょうか、それともCSSにあらかじめコンパイルするのでしょうか? LESSプラグインはどのようにPlay Frameworkで動作しますか?クライアントサイドを解釈するJavascriptスニペットを挿入しますか?

ここで実際に何が起こっていますか?

答えて

2

再生のためにLunatech LESS pluginを使用している場合は、 1の場合、lessファイルを実際にAsual LESSを使用してオンザフライでコンパイルして静的に処理しているようです。抜粋:

/** 
* Get the CSS for this less file either from the cache, or compile it. 
*/ 
public String get(File lessFile) { 
    String cacheKey = "less_" + lessFile.getPath() + lastModifiedRecursive(lessFile); 
    String css = Cache.get(cacheKey, String.class); 
    if(css == null) { 
     css = compile(lessFile); 
     Cache.set(cacheKey, css); 
    } 
    return css; 
} 

protected String compile(File lessFile) { 
    try { 
     return lessEngine.compile(lessFile); 
    } catch (LessException e) { 
     return handleException(lessFile, e); 
    } 
} 

lessEnginecom.asual.lesscss.LessEngineインスタンスです。

他の人も指摘したように、LESSを使用する一般的な方法は、コンテンツを提供する前に自分でコンパイルするか、クライアントが実行時にコンパイルするようにJavaScriptプラグインを使用することです。

+0

実際のところ私のブラウザは実際のLESSファイル(foo.less)を見ていると解釈しているわけではありません。私はそれがまだ 'type =" text/css "'を持っていると思いますが、 '.less'で終わっています。 – ripper234

1

less cssはjavascriptライブラリで "〜コンパイルされています"(プロダクション用にサーバー側で実行する必要があります)。 あなたのサイトでもっと読むことができます: http://lesscss.org/#-client-side-usage

+0

しかし私のChromeはネイティブのLESSファイルを理解しているようです。私はPlay Framework LESSプラグインを使用しています - 私はPlayの周りに焦点を当てるように質問をしました...答えが一般的であるかどうかわかりません。 – ripper234

+0

Chromeは '.less'ファイルを扱うJavaScriptがなければそれを理解しません。 – ceejayoz

+0

@ceejayoz - だから多分私はそれのためにいくつかのJSを提供しているし、私はそれを知らない。うーん。 – ripper234

0

どちらもオプションです。遊びます! 2.0には、サーバー側でLESSをコンパイルするための組み込みサポート(およびCoffeeScript)も組み込まれています。

+0

LESSモジュールはどのようにデフォルトで動作しますか?私はモジュールのインストール以外の調整や設定をしていませんし、LESSファイルが動作し始めたばかりなので、どういうふうに動作するのか不思議に思っています。 – ripper234

+0

私はPlayでLESSモジュールの経験がありません! 1. 2.0以下でモジュールになることはありません。 –

+1

再生に特化したものではなく、lesscを使用してLESSをCSSにコンパイルして見ることができます。混乱もなく、自動化もありません。 –

関連する問題