@ marceloverdijk ＃331についてどう思うか、スタイルシートをインポートするときにパスをどのように調整する必要があるかをここで知りたいと思います。

ルールは単純です。 .lessで終わるファイル、または拡張子のないファイルのみをインポートし、残りはブラウザに任せます。 したがって、 <strong i="6">@import</strong> "foo.css"はそのままで、 <strong i="8">@import</strong> "foo"と<strong i="10">@import</strong> "foo.less"が解析され、ファイルがインポートされます。

OK、ルールは明確です。 ありがとう。

しかし、なぜGoogle Font Importが実際にインポートされるのか分かりますか？
唯一の違いは、実際のブラウザーの代わりにEnv.jsとRhinoを使用していることです。

Env.jsによって理解されていない（または誤って）インポートする必要があるかどうかを判断するために、より少ないロジックが何かを使用している可能性がありますか？

助けていただければ幸いです。

これを使用してLESSをコンパイルしていることに注意してください。

var result; var p = new less.Parser（）; p.parse（input、function（e、tree）{result = tree.toCSS（）;}）;

ルールに関する1つの質問。 引用符は重要ですか？

import.jsの少ないソースでこれに気づきました：

    if (path instanceof tree.Quoted) {
        this.path = /\.(le?|c)ss$/.test(path.content) ? path.content : path.content + '.less';
    } else {
        this.path = path.value.content || path.value;
    }

私が使用した回避策は、フォントURLに&.cssを追加して、LESSパーサーをだまして通常のCSSインポートのように処理させることです。 そのようです：

<strong i="7">@import</strong> url(http://fonts.googleapis.com/css?family=Open+Sans&.css);

ところで、LESSの元の設計者が古い@importを再利用する代わりに、別の@includeディレクティブを使用しなかったのは非常に残念です...

テストhttps://github.com/cloudhead/less.js/blob/master/test/less/import.lessで示唆されているように、それがなくても機能するはずです

を含む

<strong i="8">@import</strong> url("import/import-test-a.less");
//<strong i="9">@import</strong> url("import/import-test-a.less");
<strong i="10">@import</strong> url(http://fonts.googleapis.com/css?family=Open+Sans);

#import-test {
  .mixin;
  width: 10px;
  height: <strong i="11">@a</strong> + 10%;
}

そして期待する

<strong i="15">@import</strong> "import-test-d.css";

<strong i="16">@import</strong> url(http://fonts.googleapis.com/css?family=Open+Sans);
#import {
  color: red;
}
.mixin {
  height: 10px;
  color: red;
}
#import-test {
  height: 10px;
  color: red;
  width: 10px;
  height: 30%;
}

まだGoogleFontsのインポートが含まれています。
私はこれらを自分でテストしていませんが、合格したと思います。

PS：このGoogle Fontsのインポートは、私のオープンソースのlesscss4jライブラリに渡されない唯一の部分です。
他のすべての互換性テストは現在合格しています。

それで、私はそれをリリースする前にこの最後の問題を解決することを本当に切望しています。 誰かが助けてくれることを願っています。

LESSでのGoogleWeb Fontsのすばらしい回避策をありがとうmaranomynet（LESSリリース1.1.3で@importを使用するのに問題がありました）。 LESSが構文のこの部分を不幸な方法で処理したことに同意します。

私は今さらに混乱しました。

簡単なWebプロジェクトを作成し、以下のコードをヘッドセクションに追加しました。

<link rel="stylesheet/less" type="text/css" href="/less/google.less">
<link rel="stylesheet/less" type="text/css" href="/bootstrap/bootstrap.less">
<script src="/js/less-1.1.4.js" type="text/javascript"></script>

Twitter Bootstrapのコンパイルは機能していますが、google.lessは機能していません。
このgoogle.lessには、LESS互換性テストimport.lessからコピーされた以下の行のみが含まれています。

<strong i="11">@import</strong> url(http://fonts.googleapis.com/css?family=Open+Sans);

ブラウザで受け取るエラーは次のとおりです。

http：// localhost ：8888 / less / http://fonts.googleapis.com/css?family=Open+Sans（404 ）を読み込めませんでした
http：// localhost ：8888 / less / google.less

今、私はimport.less互換性テストについて本当に疑問に思い始めます...。

URLインポートを閉じる前に＆.cssを追加し

から
@import url（http://fonts.googleapis.com/css?family=Open+Sans）;

に
@import url（http://fonts.googleapis.com/css?family=Open+Sans&css）;

私も同様の問題を抱えていたので、これが誰かに役立つ場合： '|'で区切られた複数のgoogleフォントをインポートしようとしていました：
@import url（http://fonts.googleapis.com/css?family=Inconsolata|Cantarell|Architects|Daughter&.css）;
これにより、「url（）の終了がありません」というエラーが発生します。

このエラーは、URLを引用符で囲むことで解決されました（注：＆。cssは引き続き末尾にある必要があります。そうでない場合、404インポートエラーが発生しました）。 すべてのフォントも正常に読み込まれます。
@import url（ "http://fonts.googleapis.com/css?family=Ubuntu+Mono|Cantarell|Architects|Daughter&.css"）;

良いヒントenoex：Dありがとう!!!!

エラー、この問題が解決された理由を理解するのは難しいです。 ユーザーは、その周りに信じられないほど危険なハッキングを発見しました。これは、Googleが＆.css;に意味を付けることを決定した場合に壊れる可能性があります。 これはlesscで修正する必要があります。 @importを文字通りに取得するように強制するための何らかのメソッドが存在する必要があります。

同意する。 助言がありますか？

<strong i="6">@import</strong> css url(...);

可能性です。 また、.css拡張子を使用してLessインポートを強制することもできます。

その構文は問題ないように見えます（私はパーサーを作成する人ではないので、それがどれほどうまく適合するかはわかりません）。

私の唯一の懸念は、他のlessコンパイラです。 私が問題を抱えていたコードは、それを書いた開発者にとっては問題なく機能しました。おそらく、コンパイラが少ないため、コンパイル時の@importすら実行されないためです。 したがって、これがlesscで修正されたとしても、おそらく「＆.css」ハックを使い続けるでしょう。 しかし、それについてあなたができることは何もありません。

誰かが修正を見つけましたか？

「＆.css」を追加してURLを引用符で囲むと、コンパイルの問題のみが解決されることがわかりました。指定しているフォントはまだレンダリングされていません。

それはまだ問題のように聞こえるので、再開しました-そうですか？

簡単な修正は、URLにパラメータが含まれている場合（例：？family = x）、URLに何も追加しないことです。

@ntoftエラーを再現できなくなりました..lesscを使用して..残っている問題は正確には何ですか？

フォローアップしていただきありがとうございます。

私は「append＆.css」アプローチを使用していて、それは現在機能しています（一部のユーザーエラー：-/）より良い方法があるかどうか単に興味がありました。 ただし、動作しているようですので、お気軽に閉じてください。

ありがとう。

追加の.cssアプローチなしで機能するのはいいことです。それで、その例はありますか？

私は誤解していると思います...問題は、インポートしたくないときにcssがインポートされていることです。

たぶん1.4.0では@importはそのままにして、 @includeを常に含める必要があります

議論を単一の問題に移す＃1185

@import url（https \：\ / \ / fonts.googleapis.com \ / css？family = Orbitron＆.css）;のような文字をエスケープする必要があります。

@ jas-naz適切で読みやすい方法は次のとおりです。

<strong i="6">@import</strong> (css) url(https://fonts.googleapis.com/css?family=Orbitron);

詳細については、 http： //lesscss.org/features/#import-atrules-feature-import-optionsを参照して

こんにちは、これを達成するための別のハックは、次のように、URLの最後に「#css」を追加することです：

<strong i="6">@import</strong> url('https://fonts.googleapis.com/css?family=Paytone+One#css');

@TyrionGraphiste

悪いアイデア。 最近のバージョンでは、Lessは実際にこのファイルを処理します（インポートをそのままにするのではありません）。
そのため、その前に(css)が義務付けられています。 （以前のバージョンでは、この特定のケースで適切な拡張子が欠落しているのではなく、コンパイラがURL内の「いくつかの」 css文字列によって決定するというのは間違った動作